更改事件前的 extjs radiogroup

Question

你能在 change/check ExtJS radiogroup 活动之前帮助我吗？我希望在根据条件更改单选按钮之前检查一些事件。如果条件为假，我需要允许用户更改 select 另一个单选按钮，那么我们只需要 select 旧单选按钮。

请参考以下代码：

Ext.application({
    name: 'Fiddle',
    launch: function () {
        Ext.create('Ext.form.Panel', {
            title: 'RadioGroup Example',
            width: 300,
            height: 125,
            bodyPadding: 10,
            renderTo: Ext.getBody(),
            items: [{
                xtype: 'radiogroup',
                fieldLabel: 'Gender',
                columns: 1,
                items: [{
                    boxLabel: 'Male',
                    name: 'rb',
                    inputValue: '1'
                }, {
                    boxLabel: 'Female',
                    name: 'rb',
                    inputValue: '2',
                }],
                listeners: {
                    change: function(field, newValue, oldValue, eOpts) {
                        console.log(newValue);
                        alert(newValue.rb);
                    },
                }
            }]
        });
    }
});

https://fiddle.sencha.com/#view/editor&fiddle/32fb

Answer 1

如评论中所述，没有可用于否决更改的 beforechange 事件。

其他一些选项是：

您可以 change 侦听器来验证无线电组，如果选择了不正确的选项，则使其无效。通过这种方式，用户会被动地得知存在问题，他们必须解决问题。
您可以通过使用 oldvalue 参数获得您所描述的行为，只需将无线电控件设置回旧值即可：

change: function(field, newValue, oldValue, eOpts) {
  if (<new value isn't acceptable>) {
     // Probably should let the user know why
     field.setValue(oldValue);
     return;
  }
  ... any other change logic here.
}

您还可以在表单状态更改时预先使用 change 侦听器启用和禁用选项，从而防止用户首先做出错误的选择。

更改事件前的 extjs radiogroup

extjs radiogroup before change event

extjs

extjs5