Меню ag-grid в липкой колонке

Ответ 1

Я бы полностью отказался от идеи добавления меню внутри ячейки.

Вместо этого я сделаю следующее:

• Добавьте меню вне сетки, спрятано,
• Держите ссылку в ячейке (это вызовет меню позже)
• Добавить событие click к этой ссылке
• Создайте класс для меню (может быть глобальным, поскольку будет только одно меню с изменяющимся контекстом)
  • Это скроет/покажет меню
  • Имейте параметры, которые хранят контекст (данные из вашей сетки или что-то еще)
• Событие клика по ссылкам из сетки будет иметь код, который показывает меню

Что-то вроде этого: этот пример не имеет ошибок для краткости.

var gridMenu = function(selector) {
    var instance = this;
    instance.element = document.querySelector(selector);
    instance.context = null; // this can be any data, depends on your project

    // sender is the link from your cell
    // context is your data (see above)
    instance.open = function(sender, context) {
        instance.context = context;
        // you may even add the sender element to your context

        instance.element.style.display('block');
        // alternatively, you could use instance.element.classList.add('some_class_to_make_menu_visible')
        // you may need to add some positioning code here (sender would contain valuable data for that)
    }

    instance.close = function () {
        instance.context = null;
        instance.element.style.display = 'none';
        // or you may remove visibility class
    }

    // click events for menu items (if you use some Javascript processing, and the menu doesn't use simple links)
    instance.menuItem1Click = function(e) {
         // do whatever you wish here
         instance.close();
         // call this at the end of each of your menu item click event handlers
    }

    // ... more click event handlers for your other menu items (one for each menu item)

    return instance;
}

// Create your menu item somewhere in your document ready code, or even where you initiate your grid (before initializing the grid)
var menu = new gridMenu("#my_awesome_floating_menu");

Это пример события щелчка ваших ссылок внутри сетки:

function cellLinkClick(event) {
    var context = {}; // whatever data you may want to send to the menu
    menu.open(event, context);
}