表单上的JQuery自定义验证

时间:2015-11-10 12:48:28

标签: jquery validation

我使用的是JQuery Validation插件,但不幸的是它与我正在使用的另一个插件不兼容。因此,我现在正在编写自己的自定义验证。目前我有类似的东西

function doValidation(formData, jqForm, options) {

    var fullName = $.trim($("#fullName").val());
    var emailAdd = $.trim($("#emailAdd").val());
    var aNum = $.trim($("#aNum").val());

    if(fullName.length == 0) {
        alert("Please enter your full name");
        return false;
    }

    if(fullName.length > 50) {
        alert("Name is to long");
        return false;
    }

    if( !validateEmail(emailAdd)) {
        alert("Invalid email");
        return false;
    }
}

function validateEmail($email) {
    return /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test($email);
}

现在显然我不想提醒错误,这是用于测试。我也不想在所有这些上都返回false。

我要做的是将所有错误添加到数组或其他内容,因为如果验证失败,我需要显示所有错误。如果验证失败,我还需要返回false,因此我的表单不会提交。每个输入可能有多个验证规则,但任何时候都只会触发一个验证规则。

我该怎么做呢?我希望将所有错误附加到具有id验证结果的div。

任何建议表示赞赏。

由于

1 个答案:

答案 0 :(得分:1)

您可以将消息存储在数组中:

function doValidation(formData, jqForm, options) {
    var errors = [];    

    var fullName = $.trim($("#fullName").val());
    var emailAdd = $.trim($("#emailAdd").val());
    var aNum = $.trim($("#aNum").val());

    if(fullName.length == 0) {
        errors.push("Please enter your full name")
    }

    if(fullName.length > 50) {
        errors.push("Name is to long")
    }

    if(!validateEmail(emailAdd)) {
        errors.push("Invalid email")
    }
    if (errors.length > 0) {
        $('#validation-results').html(errors.join('<br>'));
        return false;
    }    
    return true;
}

现在,为了避免表单执行:

您可以根据您发送或不发送的验证方法获得表格。

希望这有帮助!