有一个简单的方法来改变默认的错误值在jQuery验证插件?
我只是想重写错误消息,以使我的应用程序更加个性化——我有很多字段,所以我不想为字段x单独设置消息……我知道我能做到!
有一个简单的方法来改变默认的错误值在jQuery验证插件?
我只是想重写错误消息,以使我的应用程序更加个性化——我有很多字段,所以我不想为字段x单独设置消息……我知道我能做到!
当前回答
$(function() {
$("#username_error_message").hide();
$("#password_error_message").hide();
$("#retype_password_error_message").hide();
$("#email_error_message").hide();
var error_username = false;
var error_password = false;
var error_retype_password = false;
var error_email = false;
$("#form_username").focusout(function() {
check_username();
});
$("#form_password").focusout(function() {
check_password();
});
$("#form_retype_password").focusout(function() {
check_retype_password();
});
$("#form_email").focusout(function() {
check_email();
});
function check_username() {
var username_length = $("#form_username").val().length;
if(username_length < 5 || username_length > 20) {
$("#username_error_message").html("Should be between 5-20 characters");
$("#username_error_message").show();
error_username = true;
} else {
$("#username_error_message").hide();
}
}
function check_password() {
var password_length = $("#form_password").val().length;
if(password_length < 8) {
$("#password_error_message").html("At least 8 characters");
$("#password_error_message").show();
error_password = true;
} else {
$("#password_error_message").hide();
}
}
function check_retype_password() {
var password = $("#form_password").val();
var retype_password = $("#form_retype_password").val();
if(password != retype_password) {
$("#retype_password_error_message").html("Passwords don't match");
$("#retype_password_error_message").show();
error_retype_password = true;
} else {
$("#retype_password_error_message").hide();
}
}
function check_email() {
var pattern = new RegExp(/^[+a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i);
if(pattern.test($("#form_email").val())) {
$("#email_error_message").hide();
} else {
$("#email_error_message").html("Invalid email address");
$("#email_error_message").show();
error_email = true;
}
}
$("#registration_form").submit(function() {
error_username = false;
error_password = false;
error_retype_password = false;
error_email = false;
check_username();
check_password();
check_retype_password();
check_email();
if(error_username == false && error_password == false && error_retype_password == false && error_email == false) {
return true;
} else {
return false;
}
});
});
其他回答
另一种可能的解决方案是遍历字段,向每个字段添加相同的错误消息。
$('.required').each(function(index) {
$(this).rules("add", {
messages: {
required: "Custom error message."
}
});
});
我们可以指定文本字段的类型来代替这些自定义错误消息。
示例:设置字段类型为type = 'email'
然后插件将识别字段并正确验证。
@Josh:你可以从你的资源包中翻译消息来扩展你的解决方案
<script type="text/javascript">
$.validator.messages.number = '@Html.Raw(@Resources.General.ErrorMessageNotANumber)';
</script>
如果你把这段代码放到你的_Layout中。cshtml (MVC),它可用于所有视图
因为我们已经使用了JQuery,我们可以让页面设计者在标记中添加自定义消息,而不是代码:
<input ... data-msg-required="my message" ...
或者,更通用的解决方案是在所有字段上使用一个简短的data-msg属性:
<form id="form1">
<input type="text" id="firstName" name="firstName"
data-msg="Please enter your first name" />
<br />
<input type="text" id="lastName" name="lastName"
data-msg="Please enter your last name" />
<br />
<input type="submit" />
</form>
然后代码包含如下内容:
function getMsg(selector) {
return $(selector).attr('data-msg');
}
$('#form1').validate({
// ...
messages: {
firstName: getMsg('#firstName'),
lastName: getMsg('#lastName')
}
// ...
});
最新版本有一些不错的内联功能。
如果它是一个简单的输入字段,您可以像这样添加属性data-validation-error-msg
data-validation-error-msg="Invalid Regex"
如果你需要一些更重的东西,你可以使用一个带有传递给validate函数的所有值的变量来完全自定义东西。详细信息请参考这个链接:https://github.com/victorjonsson/jQuery-Form-Validator#fully-customizable