我在这里待了很长时间。我正在尝试在2个字段上使用两组验证(两个日期,验证发生在onblur,验证引擎的默认事件)。
第一组验证一直在进行,并验证用户是否有有效的输入日期。
第二组验证仅在两个字段都具有正确日期时发生。它会执行检查以验证两组日期都有一个有效的日期范围来搜索。
但它是我目前遇到atm问题的第二个问题。我的FuncCalls由于某种原因未被识别。我已经查看了文档和源代码,但我仍然不确定这样做的确切方法是什么,或者就此而言,在处理相互依赖的字段方面,如果有更好的方法来处理它。
<html>
<head>
<script src="../../inc/functions.js" type="text/javascript"></script>
<script src="../../inc/jquery-min.js" type="text/javascript"></script>
<script src="../../inc/jquery.validationEngine.js" type="text/javascript"></script>
<script src="../../inc/jquery.validationEngine-en.js" type="text/javascript"></script>
<link href="../../inc/validationEngine.jquery.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
//returns true if end is later than start
function dateCompare(start, end) {
if (isDate(start) && isDate(end)) {
return (new Date(start.toString()) < new Date(end.toString()))
}
}
$(document).ready(function () {
$("#arbitraryForm").validationEngine('attach');
function rangeCheck(field, rules, i, options) {
alert("rangeCheck caLLEd");
var inDate1 = $("#inDate1").val();
var inDate2 = $("#inDate2").val();
if (!dateCompare(inDate1, inDate2)) {
return "arbitarty error";
}
}
$("#inDate1").blur(function (e) {
var inDate1 = PadDate($("#inDate1").val());
var inDate2 = PadDate($("#inDate2").val());
if (isDate(inDate1)) {
document.getElementById("inDate1").value = inDate1;
if (isDate(inDate2)) {
if (dateCompare(inDate1, inDate2)) {
}
}
}
}),
$("#inDate2").blur(function (e) {
var inDate2 = PadDate($("#inDate2").val());
if (isDate(inDate2)) {
document.getElementById("inDate2").value = inDate2;
}
})
});
</script>
</head>
<form id="arbitraryForm" action="whatever_page.html">
<div>
<input type="text" id="inDate1" name="inDate1" value="" class="validate[required,custom[dateFormat],funcCall[rangeCheck]]" />
<input type="text" id="inDate2" name="inDate1" value="" class="validate[required,custom[dateFormat],funcCall[rangeCheck]]" />
</div>
<input id="subbtn" type="submit" value="Run Report" name="subbtn"/>
</form>
</html>
答案 0 :(得分:2)
将rangeCheck
函数移到$(document).ready
包装器之外(例如,直接位于dateCompare
函数下面)。
如果在$(document).ready
方法中声明它,则将其范围限制为该方法。
答案 1 :(得分:2)
我认为你正在增加你并不真正需要的复杂性(这似乎在jQuery中发生了很多)。为什么不使用类似的东西:
function rangeCheck() {
alert("rangeCheck caLLEd");
var inDate1 = $("#inDate1").val();
var inDate2 = $("#inDate2").val();
if (!dateCompare(inDate1, inDate2)) {
//flag the error in the form here, if you want
return false;
}
return true;
}
function blur1() {
var inDate1 = PadDate($("#inDate1").val());
var inDate2 = PadDate($("#inDate2").val());
if (isDate(inDate1)) {
document.getElementById("inDate1").value = inDate1;
if (isDate(inDate2)) {
if (dateCompare(inDate1, inDate2)) {
}
}
}
}
function blur2() {
var inDate2 = PadDate($("#inDate2").val());
if (isDate(inDate2)) {
document.getElementById("inDate2").value = inDate2;
}
}
<form id="arbitraryForm" action="whatever_page.html" onSubmit="return rangeCheck();">
<div>
<input type="text" id="inDate1" name="inDate1" value="" onBlur="blur1();" />
<input type="text" id="inDate2" name="inDate1" value="" onBlur="blur2();" />
</div>
<input id="subbtn" type="submit" value="Run Report" name="subbtn"/>
</form>
......它更短,更明确的是它在做什么。
此外,无需在rangeCheck()
块内定义您的命名函数(在本例中为document.ready
)。您可以根据需要使用,但如果您这样做,您可能希望将其明确地分配到全局范围,如下所示:
window.rangeCheck = function(field, rules, i, options) {
alert("rangeCheck caLLEd");
var inDate1 = $("#inDate1").val();
var inDate2 = $("#inDate2").val();
if (!dateCompare(inDate1, inDate2)) {
return "arbitarty error";
}
};