ExtJS：复选框单击或按键事件答案

【问题标题】：ExtJS: checkbox click or keyup eventExtJS：复选框单击或按键事件
【发布时间】：2016-09-03 19:04:53
【问题描述】：

现在我可以在我的controller 中处理checkbox 的change 事件。我是这样做的：

"[itemId=TestCheckbox]": {
   change: this.updateCheckbox
}

我对此不满意的是，即使复选框的状态以编程方式更改时也会触发此事件 - 例如，当第一次绑定值时。所有这些都会导致不必要的服务器请求：

第一个请求从服务器获取数据并将值绑定到复选框
触发更改事件并完成另一个服务器请求

我不喜欢这样。我想要一些类似 keyup 事件或检查事件的东西，以便我可以触发服务器请求，只有当复选框的状态是手动更改而不是编程时。

【问题讨论】：

标签： javascript extjs

【解决方案1】：

您可以尝试将mousedown/keydown 处理程序添加到复选框el，然后在那里设置一个标志，并在更改事件处理程序中检查该标志

{
    xtype:     'checkboxfield',
    listeners: {
        mousedown: {
            element: 'el',
            fn:      function (e, el) {
                Ext.getCmp(e.currentTarget.id).myFlag = true
            }
        },
        change:    function (cb, newValue, oldValue, eOpts) {
            console.log(cb, cb.myFlag)
        }

    }
}

【讨论】：

这听起来很合理。谢谢！
它对我来说很好用。我还在键盘上添加了事件，因为用户可以使用空格键切换复选框。 keyup: { element: 'el', fn: 'onKeyUp' }

【解决方案2】：

如果您使用 setValue 将值设置为组合，它会触发 change 事件。检查here

您可以使用 suspendEvents 和 resumeEvents 来避免这种情况。

设置值前调用suspendEvents，设置值后调用resumeEvents(true)。

suspendEvents 将阻止所有由 setValue 触发的事件，而 resumeEvents 将再次恢复触发事件。不要忘记将 true 参数传递给 resumeEvents

combo.suspendEvents();
combo.setValue(value);
combo.resumeEvents(true);

阅读有关suspendEvents 和resumeEvents 的更多信息。

【讨论】：

不，我没有使用setValue。正如我所说，我使用绑定。