ExtJS 4 CheckboxModel在使用MULTI模式时如何允许取消选择答案

【问题标题】：ExtJS 4 CheckboxModel how allow deselect when using mode MULTIExtJS 4 CheckboxModel在使用MULTI模式时如何允许取消选择
【发布时间】：2011-10-21 15:32:50
【问题描述】：

我们在应用程序中使用了一个复选框模型，它要求我们允许选择网格中的多个项目。因此我们必须在我们的复选框模型中设置模式：'MULTI'。

默认行为要求用户在使用此配置时按住 CTRL 并单击一个项目以取消选择它。我想覆盖默认行为，以允许用户通过第二次单击来取消选择列表中的项目。 checkboxModel 的 allowDeselect 配置只能在模式设置为 SINGLE 时使用，而且我们再次使用 MULTI。

非常感谢任何有关在 ExtJS 4 中覆盖此行为的建议！

【问题讨论】：

标签： extjs extjs4

【解决方案1】：

你的意思是mode: 'SIMPLE'？

mode：字符串
选择模式。有效值为：

SINGLE - 一次只允许选择一项。使用 allowDeselect 允许取消选择该项目。这是默认设置。

简单 - 允许简单地逐一选择多个项目。每次点击网格都会选择或取消选择一个项目。

MULTI - 允许使用 Ctrl 和 Shift 键复杂地选择多个项目。

试试看：DEMO

应该从 3+ 开始工作。我不认为这个配置是新的。

【讨论】：

【解决方案2】：

试试这个：

// Allow deselecting the only selected record in MULTI mode with a simple click.
// Note that this will only happen when allowdeselect is true
Ext.override( Ext.selection.Model, {
    selectWithEvent: function(record, e, keepExisting) {
        var me = this;

        switch (me.selectionMode) {
            case 'MULTI':
                if (e.ctrlKey && me.isSelected(record)) {
                    me.doDeselect(record, false);
                } else if (e.shiftKey && me.lastFocused) {
                    me.selectRange(me.lastFocused, record, e.ctrlKey);
                } else if (e.ctrlKey) {
                    me.doSelect(record, true, false);
                // Mod Start
                } else if (me.isSelected(record) && !e.shiftKey && !e.ctrlKey && me.selected.getCount() == 1 && me.allowDeselect) {
                    me.doDeselect(record, false);                    
                // Mod End                        
                } else if (me.isSelected(record) && !e.shiftKey && !e.ctrlKey && me.selected.getCount() > 1) {
                    me.doSelect(record, keepExisting, false);
                } else {
                    me.doSelect(record, false);
                }
                break;
            case 'SIMPLE':
                if (me.isSelected(record)) {
                    me.doDeselect(record);
                } else {
                    me.doSelect(record, true);
                }
                break;
            case 'SINGLE':
                // if allowDeselect is on and this record isSelected, deselect it
                if (me.allowDeselect && me.isSelected(record)) {
                    me.doDeselect(record);
                // select the record and do NOT maintain existing selections
                } else {
                    me.doSelect(record, false);
                }
                break;
        }
    },
});

【讨论】：

【解决方案3】：

在 ExtJS 4 中，如果需要 shift 键选择，则覆盖 'onRowSelection;多选的方法和修改条件 " if (mode !== 'SINGLE' && mode !== 'MULTI') "

【讨论】：