javascript - Extjs 在窗口中验证面板

Question

可用:Ext.form.Panel:

this.myForm = Ext.create("Ext.form.Panel", {
            items : [{
                xtype : 'textfield',
                name : 'val1',
                fieldLabel : 'val1',
                            allowBlank: false,
                validator : function(value) { // validate val1
                    if (!(/^[a-zA-Z]+[\w]*$/.test(value)))
                        return "val1 is not valid";
                    return true;
                }
            }, {
                xtype : 'textfield',
                name : 'code',
                fieldLabel : 'val2',
                allowBlank: false,
                validator : function(value) { // validate val2
                    if (!(/^[a-zA-Z]+[\w]*$/.test(value)))
                        return "val2 is not valid";
                    return true;
                }
            }]
        });

然后传给Window:

Ext.window.Window:

this.someWindow = Ext.create("Ext.window.Window", {
          items : [me.myForm, me.anotherPanel],
          title : 'test',
          closeAction : 'hide',
          buttons : [{
              text : 'Save',
              handler : function() { // some actions
                                }

如何在 someWindow 中验证 myForm 中的 val1 和 val2 on action: save？

Answer 1

这将调用验证器函数

handler: function(button) {
     var valid = button.up('window').down('form').getForm().isValid();
     if(valid) {
         ...
     }
}

编辑:

或者您将保存按钮移动到表单 buttons 配置中，并将选项 formBind: true 添加到按钮。只要表单无效，这就会禁用该按钮。