Ext js Проверка формы флажок - PullRequest
0 голосов
/ 17 апреля 2020

Как я могу проверить поле флажка в форме? Я хочу, чтобы форма была действительна ТОЛЬКО если выбрано / отмечено поле checkbox. Как мне этого добиться?

Я создал эту скрипку: https://fiddle.sencha.com/#view / editor & fiddle / 359u

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

Если я удаляю required: true, для checkboxfield тогда форма действительна.

Я использую Ext js 7.1.0 Modern

Ответы [ 2 ]

0 голосов
/ 18 апреля 2020

Другое решение, которое я нашел, это верхний ответ:

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

Замечание !!!

В поле со списком будет отправлено значение true, а НЕ значение, если оно установлено value: 'foo'

0 голосов
/ 17 апреля 2020

Похоже, что есть ошибка в инфраструктуре 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

...