Ext JS 4: показать все столбцы в Ext.grid.Panel как пользовательский параметр

Есть ли функция, которую можно вызвать на Ext.grid.Panel в ExtJS, которая сделает видимыми все столбцы, если некоторые из них скрыты по умолчанию? Всякий раз, когда конечному пользователю нужно показать скрытые столбцы, ему нужно щелкнуть каждый столбец. Ниже у меня есть код для добавления настраиваемого параметра меню при выборе заголовка поля. Я хотел бы выполнить эту функцию, чтобы отображались все столбцы.

В качестве примера ниже у меня по умолчанию скрыты «Идентификатор проекта» и «Создан пользователем». При выборе «Выбрать все столбцы» эти столбцы будут включены, поэтому они будут отображаться в представлении списка.

        listeners: {

            ... 

            },
            afterrender: function() {
                var menu = this.headerCt.getMenu();
                menu.add([{
                    text: 'Select All Columns',
                    handler: function() {
                        var columnDataIndex = menu.activeHeader.dataIndex;
                        alert('custom item for column "'+columnDataIndex+'" was pressed');
                    }
                }]);           
            }
        }
    });

введите здесь описание изображения

===========================

Ответ (с кодом):

Вот что я решил сделать на основе приведенного ниже кода Эрика, поскольку скрывать все столбцы было глупо.

            afterrender: function () {
                var menu = this.headerCt.getMenu();
                menu.add([{
                    text: 'Show All Columns',
                    handler: function () {
                        var columnDataIndex = menu.activeHeader.dataIndex;
                        Ext.each(grid.headerCt.getGridColumns(), function (column) {
                            column.show();
                        });
                    }
                }]);
                menu.add([{
                    text: 'Hide All Columns Except This',
                    handler: function () {
                        var columnDataIndex = menu.activeHeader.dataIndex;
                        alert(columnDataIndex);
                        Ext.each(grid.headerCt.getGridColumns(), function (column) {
                            if (column.dataIndex != columnDataIndex) {
                                column.hide();
                            }
                        });
                    }
                }]);
            }

grid multiple-columns show extjs
person MacGyver    schedule 27.08.2012    source источник

Ответы (2)


arrow_upward
5
arrow_downward

Если вам не нужна какая-то особая логика, вы можете попробовать что-то вроде этого:

Ext.each(grid.headerCt.getGridColumns(), function(column){
    column.show();
});
person Eric    schedule 27.08.2012

arrow_upward
1
arrow_downward

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

Я обошел это с помощью этого:

grid.suspendLayout = true;
Ext.each(grid.headerCt.getGridColumns(), function(column) {
    column.show();
});
grid.suspendLayout = false;
grid.doComponentLayout();
person egerardus    schedule 27.08.2012