forms - 将字段标记为无效

Question

我使用了一个自定义的AJAX vtype，它可以正常工作。
但是我注意到extjs文档注意到

“注意:如果值通过验证，此方法不会导致Field的validate或isValid方法返回false。因此，简单地将Field标记为无效将不会阻止使用Ext.form.action.Submit.clientValidation选项提交的表单的提交组。”

如何将一个字段标记为无效，以便form.isValid()返回false？
我的vtype:

Ext.apply(Ext.form.VTypes, {
username: function(value, field){        
    var conn = new Ext.data.Connection();
    conn.request({
        url: 'test.php',
        params:{email:value},
        method: 'POST',

        success: function(responseObject){
            var resp = responseObject.responseText;
            if (resp == 0) {
                field.markInvalid('This email is invalid or already registered!');                
            } else if (resp == 1) {
                field.clearInvalid();
            }
        },
        failure: function(){                
           Ext.Msg.show({title: 'Error', msg: 'Connection error!',});
        }
    });
    return true;
}
});

Answer 1

好吧，如果您查看clientValidation的定义:

确定是否在对的最终调用中验证表单的字段
isValid提交之前。在表单的提交选项中传递false
为了防止这种情况。如果 undefined ，则提交前字段验证为
执行。

基本上是说，如果将其设置为false，那么表单将在提交之前自动进行验证...此时，如果您将任何字段标记为无效，它将失败。如果将其设置为true，则需要在提交之前手动检查表单是否有效。

值得指出的是，您的AJAX vtype永远无法工作。当表单调用vtype来检查字段是否有效时，它所得到的全部响应就是true ...，因此无论如何表单都将提交。即使您告诉它在ajax请求完成之后返回，表单也将在vtype ajax请求完成之前提交。

更好的解决方案是在您的提交按钮处理程序中手动包括对vtype的调用...然后在ajax请求的success中执行

if(form.isValid()) {
   form.getForm().submit();
}

这将强制“提交”按钮的click事件首先验证用户名字段，然后才验证表单的有效性。