del*_*ttg 1 javascript jquery jquery-validate
基于这个问题,我试图将两个变量传递给自定义验证器方法。使用console.log我可以看到上限和下限范围是在 HTML 中定义的,但没有正确传递给选项,而是我得到的NaN。
问题似乎是两个文本框的值尚未定义或设置(当它们在下面的验证规则中发送时),但是当它们到达验证器时(这只是一个猜测,我还没有在验证尝试之前无法想出一种方法来嗅探它们的值)。因此,如果我将它们记录在验证器方法中,它们会显示得很好,但如果我将它们作为变量传递,它们会在 PCBID 对象(Chrome 浏览器)中显示为 NaN:
Object {PCBID: Object}
PCBID: Object
lower: NaN
upper: NaN
__proto__: Object
__proto__: Object
Run Code Online (Sandbox Code Playgroud)
这是验证器,还设置了其他规则来防止输入任何整数,因此这不应该是问题:
//this validator checks to make sure the user has entered the PCBIDs in
//the correct order in the range form.
$.validator.addMethod("highLowCheck", function (value, element, options)
{
console.log("Inside highLowCheck validator");
console.log(parseInt($('#pcbid_range_lower').val(),10)); //shows expected values
console.log(parseInt($('#pcbid_range_upper').val(),10)); //shows expected values
console.log(options.PCBID.upper); //NaN
console.log(options.PCBID.lower); //NaN
//evaluates to false because NaN is falsey
console.log(options.PCBID.upper > options.PCBID.lower);
console.log("Done logging");
return options.PCBID.upper > options.PCBID.lower;
}
);
Run Code Online (Sandbox Code Playgroud)
以下是我试图传递的变量:
pcbid_range_upper: {
required: true,
digits: true,
rangelength: [3, 6],
highLowCheck:
{ PCBID:
{
//this doesn't work
lower: parseInt($('#pcbid_range_lower').val(),10),
upper: parseInt($('#pcbid_range_upper').val(),10)
}
},
Run Code Online (Sandbox Code Playgroud)
如果我传入这样的原始值:
highLowCheck:
{ PCBID:
{
lower: 1000, //works
upper: 2000
}
},
Run Code Online (Sandbox Code Playgroud)
这种方法有效,但不是很有用,因为用户可以输入他们喜欢的任何值,所以我必须能够将它们作为变量传递。我还需要它来处理变量,因为我需要从多个验证例程中调用它,否则我将直接使用验证器中的变量(就像我之前需要多个表单来使用验证器一样) 。
如果有用的话,这里是两个输入的 HTML:
<div data-role="fieldcontain" data-controltype="textinput" class="pcbid_selections" tabindex="2">
<label for="pcbid_range_lower">Starting PCBID *</label>
<input name="pcbid_range_lower" id="pcbid_range_lower" class="create_group" placeholder="52759" value="" type="text" data-mini="true" />
</div>
<div data-role="fieldcontain" data-controltype="textinput" class="pcbid_selections" tabindex="3">
<label for="pcbid_range_upper">Ending PCBID *</label>
<input name="pcbid_range_upper" id="pcbid_range_upper" class="create_group" placeholder="52769" value="" type="text" data-mini="true">
</div>
Run Code Online (Sandbox Code Playgroud)
问题: 如何将规则内的变量传递给自定义验证器?
编辑:
解决方案:感谢@Sparky & Mathletics
验证器方法更改为仅接收我想要传递的两个变量名称的字符串,而不是它们的内容。然后使用@Mathletic的建议,我只需将它们放入验证器内的jQuery变量形式:
//this validator checks to make sure the user has entered the PCBIDs in the
//correct order in the range form.
$.validator.addMethod("highLowCheck", function (value, element, options){
return parseInt($('#' + options.PCBID.upper).val(), 10) >
parseInt($('#' + options.PCBID.lower).val(), 10);
}
);
Run Code Online (Sandbox Code Playgroud)
并从规则中调用它们,如下所示:
highLowCheck:
{
PCBID:
{
lower: 'pcbid_range_lower',
upper: 'pcbid_range_upper'
}
},
Run Code Online (Sandbox Code Playgroud)
仅供任何发现此内容的人参考,我尝试将井号(“#”)与规则中的字符串(EG:)一起传递 '#pcbid_range_lower',但这似乎不起作用。此方法可以,您只需在验证器方法中添加“#”即可,效果很好。
引用OP:
“问题:如何将规则内的变量传递给自定义验证器?”
内宣布.validate()...
rules: {
myField: {
customMethod: [1, "two", 3, "foo"]
}
}
Run Code Online (Sandbox Code Playgroud)
customMethod定义...
$.validator.addMethod("customMethod", function (value, element, options) {
console.log(options[0]); // <- 1
console.log(options[1]); // <- "two"
console.log(options[2]); // <- 3
console.log($('[name=' + options[3] + ']').val()); // <- value of field named "foo"
console.log(value); // <- the value of "myField"
console.log(element); // <- the "myField" object
// your function
}, "Custom message with options used as {0}, {1}, {2}, {3} etc.");
Run Code Online (Sandbox Code Playgroud)
演示: http: //jsfiddle.net/pupggbu7/
文档: http: //jqueryvalidation.org/jQuery.validator.addMethod/
| 归档时间: |
|
| 查看次数: |
7271 次 |
| 最近记录: |