Extjs验证表单复选框字段

Question

如何验证表单中的复选框字段？我希望表单仅在选中/选中复选框字段时才有效。我该如何实现？

我创建了这个小提琴：https://fiddle.sencha.com/#view/editor&fiddle/359u

        xtype: 'checkboxfield',
        name: 'accept',
        required: true,

如果删除required: true,的checkboxfield，则该表格有效。

我正在使用Extjs 7.1.0 Modern

Answer 1

似乎sencha框架中存在错误。

我为此创建了解决方法：

let form = Ext.create({
    xtype: 'formpanel',
    renderTo: document.body,
    items: [{
        xtype: 'textfield',
        name: 'name',
        value: 'My Name',
        required: true,
        label: 'Name'
    }, {
        xtype: 'checkboxfield',
        name: 'accept',
        required: true,
        label: 'Accept Terms and Conditions',
        listeners: {
            change: function (field, newValue) {
                if (newValue) {
                    this.setValue(newValue);
                } else {
                    this.setValue(null);
                }

            }
        }
    }],
    buttons: [{
        text: 'check',
        handler: function () {
            let form = Ext.first('formpanel');
            let valid = form.validate();
            Ext.toast(Ext.String.format('Valid: {0}', valid))
        }

    }]
});

小提琴示例：https://fiddle.sencha.com/#view/editor&fiddle/35a1

Answer 2

我发现的另一个解决方案是最高答案，这是：

Ext.define('MyCheckboxOverride', {
    override: 'Ext.field.Checkbox',

    updateChecked: function(value){
        console.log('updateChecked', value, this);
        this.callParent(arguments);
        this.setValue(value || null)
    }

});

https://fiddle.sencha.com/#view/editor&fiddle/35a5

备注！

如果设置为value: 'foo'，则组合框将提交true，而不是该值