Question

我对jquery验证插件很新。尝试比较两个字段中的日期值，如果一个日期早于另一个日期，则触发错误。这是标记：

        <label>Last prescription fill date:</label>
        <input type="text" ID="InputLastPrescriptionFillDate" 
             style="width: 200px" 
             Class="calendarSelectInput dateComparison required" />
        <br />
        <label>Prescription start date:</label>
        <input type="text" ID="InputPrescriptionStartDate" name="InputPrescriptionStartDate" 
             style="width: 200px" 
             Class="calendarSelectInput dateComparison required" />

这是jQuery。

$(document).ready(function() {
     $("form").validate({
            rules: {
                InputPrescriptionStartDate: {
                    required: compareRxDates()
                }
            },
            messages: {
                InputPrescriptionStartDate: {
                    required: "Last prescription fill date should not be after the prescription start date."
                }
            }
     });
});

回调javascript。

function compareRxDates() {
    return new Date($("#InputPrescriptionStartDate").val()) < new Date($("#InputLastPrescriptionFillDate").val());
}

...会在document.ready上调用，但不会在字段中的值发生变化时调用。我尝试在这些字段的更改事件中包装form.validate，但此函数仍未被调用。

我做错了什么？对于我想要做的事情，这甚至是正确的方法吗？

Answer 1

您似乎正在将compareRxDates()分配给required属性，该属性应该是布尔值 - true或false，告诉插件是否需要该字段。您应该将回调放在depends属性中。

示例：

$("form").validate({
    rules: {
        InputPrescriptionStartDate: {
            depends: function(element) {
                compareRxDates();
            }
        }
    },
// etc

来自文档：

可以将每个规则指定为具有依赖属性，以仅在特定条件下应用规则

更新（通过示例提出更好，可重复使用的解决方案）

您可以添加自己的验证方法，您可以在其他字段上重复使用，例如：

jQuery.validator.addMethod("shouldBeGreaterThan", function(value, currentElement, argumentElement) {
   return value > $(argumentElement).val();
}, "* This field should be greater than the other");

$("form").validate({
    rules: {
        InputPrescriptionStartDate: {
            shouldBeGreaterThan: $("#InputLastPrescriptionFillDate")
        }
    }
});

addMethod函数接收3个参数。方法名称，评估函数以及在评估为false时将显示的消息（可以为单个元素覆盖）。在上面的例子中，我做了一个验证方法，要求参数元素的值应该大于当前值。这可以很容易地改变以适应日期。

下面是一个工作示例：http://jsfiddle.net/bZzrs/5/

Answer 2

这对我有用：

jQuery.validator.addMethod("beforeFillDate", function(value, element) {
    var rxDate = new Date(value);
    var lastFillDate = new Date($("#InputLastPrescriptionFillDate").val());
    return rxDate > lastFillDate;
}, "Last prescription fill date should not be after prescription start date.");

然后......

$("form").validate({ 
     rules: { InputPrescriptionStartDate: { beforeFillDate: true}} 
});

为什么回调的JQuery验证不起作用？

2 个答案: