我有以下代表时间的控件：
<div id="xxx"> <input type="text" name="xxx.hour"/> <input type="text" name="xxx.minute"/> </div>
因为我想添加验证,我补充说：
<div id="xxx" data-val="true" data-val-time="Time no valid"> <input type="text" name="xxx.hour"/> <input type="text" name="xxx.minute"/> </div>
$.validator.addMethod("time_method",function (val,el,params) {
var elementId = $(el).attr('id');
alert('id ' + elementId);
var hour= $(el).children('input[name$=.hour]').val();
var minute= $(el).children('input[name$=.minute]').val();
return hour>= 0 && hour<24 && minute>=0 && minute<23;
});
$.validator.unobtrusive.adapters.add("time",{},function (options) {
options.rules["time_method"] = true;
options.messages["time_method"] = options.message;
});
但是方法“time_method”永远不会执行,我猜因为jquery.validate只适用于输入标签,我是对的吗？
最好的方法是什么？
谢谢.
更新：我知道它可以通过多种方式完成,我只是对这种方式的可能性感兴趣.我已经简化了问题,以展示我正在努力实现的一个非常小而愚蠢的例子.
解决方法
演示：
http://so.devilmaycode.it/jquery-unobstrusive-validation-on-composite-html-control
你的代码应该是这样的：
$(function() {
$.validator.addMethod('time_method',function(val,el) {
var re,max;
if (el.id == 'xxx_hour') {
re = /^\d{1,2}$/;
max = 24;
}
if (el.id == 'xxx_minute') {
re = /^\d{2}$/;
max = 59;
}
return re.test(val) && val >= 0 && val <= max;
},'Time no valid');
$("#xxx").validate({
rules: {
xxx_hour: 'time_method',xxx_minute: 'time_method',}
});
});
你的HTML类似于：
<form id="xxx"> <input type="text" name="xxx_hour" id="xxx_hour" maxlength="2"/> <input type="text" name="xxx_minute" id="xxx_minute" maxlength="2"/> </form>
