Question

下面是带有电子邮箱的窗口面板的extjs代码，我使用vtype：email来检查验证。该框显示无效电子邮件的错误，但提交按钮仍然有效。当用户点击按钮时，如何抛出无效的电子邮件错误？

    {
    vtype:'email',
    name: 'email',
    fieldLabel: 'Email',
    allowBlank:false,
    id: 'inviteEmail'
     },{
   xtype: 'button',
    text: 'Send',
    id: 'invitebuttonid',

    handler: function(btn){
    var email = Ext.getCmp('inviteEmail').getValue(); 
    var box = Ext.MessageBox.wait('Sending The Invitation..', 'Inviting User')
        Ext.Ajax.request({
         url: 'url',
               params:{
                   email: email
 },
            timeout: 300000,
            method: 'POST',
            success: function(response, opts){
                var result = Ext.decode(response.responseText);
                if (result.success === true) {
                    Ext.example.msg('Success',  result.message);
                    box.hide();
                }
                else {
                    Ext.Msg.alert('Failed', result.message);
                }
            },
            failure: function(response, opts){
                var result = Ext.decode(response.responseText);
                Ext.Msg.alert('Failed');

            }
        });
    }

Answer 1

要根据表单状态自动激活或停用按钮，您需要添加配置formBind: true。

{
    xtype: 'button',
    text: 'Send',
    id: 'invitebuttonid',
    formBind: true,
    ...
}

Answer 2

在提交之前检查form.isValid（）。通过获取值并自己发出Ajax请求来绕过验证。

尝试

var form = this.up('form');
If (form.isValid()) {
     // your handler code

即使使用vtype的电子邮件验证失败，为什么提交按钮仍然可以在extjs中使用？

2 个答案: