Ext js网格删除选择模型

Question

我有一种情况需要动态添加或删除网格选择模型。

搜索文档我发现选择模型没有destroy()方法或类似的东西。 如何从ext js 4.x中的网格中删除或销毁选择模型？

如果这是不可能的，我仍然可以选择恢复某些功能并动态地将选择模型添加到已创建的网格中。 但我也不确定这是否可行。

Answer 1

我建议禁用选择模型而不是销毁它。

您可以清除当前选择（ deselectAll ）并锁定选择模型以防止进一步选择（ setLocked ）：

selModel.deselectAll();
selModel.setLocked(true);

当您使用复选框选择模型时，您还需要隐藏添加到网格中的相应列：

grid.headerCt.child('gridcolumn[isCheckerHd]').hide();

Answer 2

选择模型不是为了替换而设计的，所以...它会变得复杂！

你必须重现sel模型的初始化，取消前一个模型，然后重新连接新模型......

这是一个用于将行选择模型替换为复选框模型的示例 。 它可能仍然包含我将忘记的第一个选择模型注册的侦听器的内存泄漏。 新的选择模型的生成依赖于getSelectionModel电网，它实现了的方法disableSelection ， simpleSelect ，和multiSelect格栅的选项（ 见代码 ）。

Ext.widget('grid', {
    renderTo: Ext.getBody()
    ,store: ['Foo', 'Bar', 'Baz']
    ,selType: 'checkboxmodel'
    ,columns: [{
        dataIndex: 'field1'
        ,text: "Name"
    }]
    ,listeners: {
        selectionchange: function(sm, records) {
            var grid = sm.view.up(),
                item = grid.down('tbtext');
            if (records.length) {
                item.setText(
                    'Selection: ' + Ext.pluck(Ext.pluck(records, 'data'), 'field1').join(', ')
                );
            } else {
                item.setText('No selection');
            }
        }
    }
    ,tbar: [{
        text: "Replace selection model"
        ,handler: function(button) {
            var grid = button.up('grid'),
                headerCt = grid.headerCt,
                checkColumn = headerCt.down('[isCheckerHd]'),
                view = grid.view,
                previous = grid.selModel,
                sm;
            // try to clean up
            previous.deselectAll();
            previous.destroy();
            // sel model doesn't clear the listeners it has installed in its
            // destroy method... you'll have to chase the listeners that are
            // installed by the specific type of sel model you're using
            if (previous.onRowMouseDown) {
                view.un('itemmousedown', previous.onRowMouseDown, previous);
            }
            if (previous.onRowClick) {
                view.un('itemclick', previous.onRowClick, previous);
            }
            // clear references
            delete grid.selModel;
            delete view.selModel;
            // create another selModel
            grid.selType = 'rowmodel';
            //grid.disableSelection = true;
            sm = grid.getSelectionModel();
            // assign new sel model
            view.selModel = sm;
            sm.view = view;
            // remove checkbox model column
            if (checkColumn) {
                headerCt.remove(checkColumn);
            }
            // init sel model is trigerred in view render events, so we must do it
            // now if the view is already rendered
            if (view.rendered) {
                sm.beforeViewRender(view);
                sm.bindComponent(view);
            }
            // finally, refresh the view
            view.refresh();
        }
    }]
    // a place to display selection
    ,bbar: [{
        xtype: 'tbtext'
        ,text: 'No selection'
    }]
});