ExtJS 6. Сетка флажка модели с подавленными событиями

Question

У меня есть сетка с тысячами записей.Работает почти нормально.Когда я программно вызываю этот метод:

selectionModel.selectAll(true);

, он прекрасно работает.Мой скрипт не зависает из-за этого параметра true, который согласно документации подавляет любые события выбора.Однако, когда я выбираю все записи с помощью флажка заголовка (который выбирает и отменяет выбор всех записей), мой сценарий останавливается.Я думаю, это потому, что по умолчанию события выбора не подавляются.Я попытался найти конфиг, который глобально подавляет выбранные события, но не смог его найти.Итак, мой вопрос, как я могу исправить эту проблему?Как я могу глобально подавить выбранные события в моей сетке selModel?

Answer 1

Вы можете использовать переопределение onHeaderClick метод сетки CheckboxModel.

В этом FIDDLE я создал демо, используятот же метод onHeaderClick.Надеюсь, что это поможет / поможет вам достичь ваших требований.

КОД SNIPPET

Ext.application({
    name: 'Fiddle',

    launch: function () {
        var store = Ext.create('Ext.data.Store', {
            fields: ['number'],
            data: (() => {
                let data = [];
                for (let i = 1; i <= 50000; i++) {
                    data.push({
                        'number': i
                    })
                }
                return data;
            })()
        });

        Ext.create('Ext.grid.Panel', {
            title: 'Demo',
            store: store,
            itemId: 'demogrid',
            columns: [{
                text: 'Number',
                flex: 1,
                dataIndex: 'number'
            }],
            height: window.innerHeight,
            renderTo: Ext.getBody(),
            selModel: {
                checkOnly: false,
                mode: 'SIMPLE',
                onHeaderClick: function (headerCt, header, e) {
                    var me = this,
                        store = me.store,
                        isChecked, records, i, len,
                        selections, selection;

                    if (me.showHeaderCheckbox !== false && header === me.column && me.mode !== 'SINGLE') {
                        e.stopEvent();
                        isChecked = header.el.hasCls(Ext.baseCSSPrefix + 'grid-hd-checker-on');
                        if (isChecked) {
                            console.time();
                            me.deselectAll(true);
                            console.timeEnd();
                        } else {
                            console.time();
                            me.selectAll(true);
                            console.timeEnd();
                        }
                    }
                }
            },
            selType: 'checkboxmodel',
            buttons: [{
                text: 'Select All',
                handler: function (btn) {
                    var grid = btn.up('#demogrid');
                    console.time();
                    grid.getSelectionModel().selectAll(true);
                    console.timeEnd();
                }
            }, {
                text: 'Deselect All',
                handler: function (btn) {
                    var grid = btn.up('#demogrid');
                    console.time()
                    grid.getSelectionModel().deselectAll(true);
                    console.timeEnd();
                }
            }]
        });
    }
});

Answer 2

используйте suspendEvents функцию на модели, чтобы остановить все события, и после того, как вы сделали, вы можете запустить все события с помощью resumeEvents

grid.getSelectionModel().suspendEvents();
grid.getSelectionModel().resumeEvents();