我们可以将通配符与jquery验证器一起使用吗 [英] Can we use wildcard with jquery validator
本文介绍了我们可以将通配符与jquery验证器一起使用吗的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
当元素名称不固定时,我们可以在此处使用通配符指定名称吗.
when element name is not fixed then can we use wild card there for specifying name.
<script type="text/javascript">
$(document).ready(function () {
$('#myform').validate({
rules: {
$("[name^=test]"): {
required: true,
maxlength: 1
}
},
messages: {
$("[name^=test]"): {
required: "You must check at least 1 box",
maxlength: "Check no more than {0} boxes"
}
},
submitHandler: function (form) { // for demo
alert('valid form submitted'); // for demo
return false; // for demo
}
});
});
</script>
</head>
<body>
<form id="myform" runat="server">
<input type="checkbox" id="chk1" name="test_1_p1" class="clschk" />x
<input type="checkbox" id="chk2" name="test_2_p2" class="clschk"/>y
<input type="checkbox" id="chk3" name="test_3_p3" class="clschk"/>z
<input id="age" type="text" name="age" /> <input type="submit" />
</form>
</body>
</html>
推荐答案
我认为实现此目标的最佳方法是考虑:
I assume the best way to achieve this goal is to consider:
- validate(规则和消息)的参数是json对象.
- 如果json对象必须具有动态内容,则可以在运行时创建
- 您需要一个自定义规则来检测所选复选框的最大数量
- 您需要定义一个函数来定义相应的错误消息(最大值不能写在一个以上的位置,以免造成混淆和副作用).
因此,解决您的问题的方法可能是:
So, a possible solution for your problem can be:
// global variable to save the validator object
var validator;
// a new rule to test if the selected checkboxes are more than the max or less than one
$.validator.addMethod('checkboxMax', function (value, elem, param) {
var cacheCheckedElements = $('[name^=test]:checked');
if (cacheCheckedElements.length < 1 || cacheCheckedElements.length > param.max) {
return false;
} else {
validator.resetForm();
return true;
}
});
$(function () {
// on ready: create the two json object: rules and messages
var myRules = {};
var myMessages = {};
$('[name^=test]').each(function (index, element) {
myRules[element.name] = {
checkboxMax: {
max: 2
}
};
myMessages[element.name] = {
checkboxMax: function(params, element) {
return 'Check no more than ' + params.max + ' boxes ';
}
};
});
// use the previous fields (myRules and myMessages) as arguments
validator = $('#myform').validate({
rules: myRules,
messages: myMessages,
submitHandler: function (form) { // for demo
alert('valid form submitted'); // for demo
return false; // for demo
}
});
});
<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js"></script>
<form id="myform" runat="server">
<input type="checkbox" id="chk1" name="test_1_p1" class="clschk"/>x
<input type="checkbox" id="chk2" name="test_2_p2" class="clschk"/>y
<input type="checkbox" id="chk3" name="test_3_p3" class="clschk"/>z
<input id="age" type="text" name="age"/> <input type="submit"/>
</form>
这篇关于我们可以将通配符与jquery验证器一起使用吗的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文