Как отсортировать "Столбцы" в меню столбцов сетки заголовка в Ext Js 6.5.2

Question

В настоящее время я работаю с Ext JS 6.5.2. И я сталкиваюсь с проблемой при сортировке пунктов меню столбцов сетки.

Я хочу отсортировать список столбцов, но помните, что я не хочу сортировать заголовок столбца. Это изображение может дать вам четкую визуализацию того, что я хочу отсортировать только список меню, но это не должно влиять на порядок заголовков сетки. Сортировать только красный список цветов, но не зеленый цвет. Пожалуйста, обратитесь к этому изображению.

* Примечание: мне не нужна сортировка по данным.

Answer 1

Вы можете достичь этого с помощью headermenucreate событие grid,

Фрагмент кода:

listeners: {
    headermenucreate: function (grid, menu, headerCt, eOpts) {
        //Fired immediately after the column header menu is created
        var columnItems = menu.down('[itemId=columnItem]'),
            menuItems = columnItems.menu.items.items;
        //sorting by column's "text" in ascending order
        menuItems.sort(function (a, b) {
            var nameA = a.text.toLowerCase(),
                nameB = b.text.toLowerCase()
            if (nameA < nameB) //sort string ascending
                return -1
            if (nameA > nameB)
                return 1
            return 0 //default return value (no sorting)
        });

    }
}

Рабочая скрипка

Надеюсь, что это поможет / поможет вам.

Answer 2

Вышеупомянутое решение не работает для сложных сеток и динамических группировок столбцов, поэтому вам также необходимо обновить ключи с помощью порядка пунктов меню, поэтому используйте приведенный ниже код, если вы обнаружите, что он не работает должным образом для вас.