Javascript 使用jQuery验证插件验证连续日期列表

Javascript 使用jQuery验证插件验证连续日期列表,javascript,jquery,validation,Javascript,Jquery,Validation,我正在使用jQuery验证插件对我的表单执行验证。我有一个动态生成的日期列表。它可以包括从o到x的日期数量。我需要验证此日期列表是否按顺序排列,并且列表末尾的任何日期都不早于列表中较早出现的日期 我已经研究了addMethod和addClassRules函数来添加这些自定义规则,但是我仍然不清楚如何实现这一点,如果其中只有一个不符合顺序,那么不会导致整个日期列表的验证失败 以前有人用Validate插件做过这种验证吗 现在,我正在使用Validate方法在javascript中添加规则,而不是向

我正在使用jQuery验证插件对我的表单执行验证。我有一个动态生成的日期列表。它可以包括从o到x的日期数量。我需要验证此日期列表是否按顺序排列,并且列表末尾的任何日期都不早于列表中较早出现的日期

我已经研究了addMethod和addClassRules函数来添加这些自定义规则,但是我仍然不清楚如何实现这一点,如果其中只有一个不符合顺序,那么不会导致整个日期列表的验证失败

以前有人用Validate插件做过这种验证吗

现在,我正在使用Validate方法在javascript中添加规则,而不是向元素添加类。下面是我正在做的一个例子:

$('#SaveForm').validate(
            {
                focusInvalid: false,
                errorContainer: errorContainer,
                errorLabelContainer: $("ol", errorContainer),
                wrapper: 'li',
                highlight: function(element) {
                    $(element).addClass('field-validation-error');
                    $(element).addClass('input-validation-error');
                },
                unhighlight: function(element) {
                    $(element).removeClass('field-validation-error');
                    $(element).removeClass('input-validation-error');
                },
                invalidHandler: function() {
                    $('#notifyBar').showNotifyBar({
                        notifyText: 'There are errors on the form. Please see the bottom of the page for details',
                        backgroundColor: '#FF0000'
                    })
            },
            rules: {
                SystemComment: {
                    maxlength: 8000
                },
                WorkComment: {
                    maxlength: 8000
                },
                DispositionGroup: {
                    required: true
                },
                DispositionCategory: {
                    required: true
                },
                DispositionDetail: {
                    required: true
                },
                NextWorkDate: {
                    required: true,
                    date: true
                }
            },
            messages: {
                SystemComment: {
                    maxlength: "System Comment max length is 8000 characters"
                },
                WorkComment: {
                    maxlength: "Work Comment max length is 8000 characters"
                },
                DispositionGroup: {
                    required: "Disposition Group is required"
                },
                DispositionCategory: {
                    required: "Disposition Category is required"
                },
                DispositionDetail: {
                    required: "Disposition Detail is required"
                },
                NextWorkDate: {
                    required: "Next Work Date is required",
                    date: "Next Work Date must be in mm/dd/yyyy format"
                }
            }
        });
我添加了这些方法来进行验证,但如果其中一个失败,则会导致所有字段的验证都失败:

jQuery.validator.addMethod("currency", function(value, element) { return this.optional(element) || /^(\d{1,3})(\.\d{1,2})?$/.test(value); }
, "Payment Amount must be in currency format xx.xx");

jQuery.validator.addMethod("paymentDateCheck", validatePaymentDates, "Payment Date(s) must be in sequential order and may not be prior to today");
jQuery.validator.addMethod("paymentAmountCheck", validatePaymentAmounts, "Total Payment Amount cannot exceed the Customer Balance");

jQuery.validator.addClassRules({
    paymentAmountField: {
        required: true,
        currency: true,
        paymentAmountCheck: true
    },
    paymentDateField: {
        required:true,
        date:true,
        paymentDateCheck:true
    }
});

jQuery.extend(jQuery.validator.messages, {
    required: "Payment Date and Payment Amount are required",
    date: "Please specifiy valid date(s)",
    currency: "Amount must be in currency format (00.00)"
});

好的,我来做这个。以下是我相当天真的实现:

一,。添加自定义验证方法:

二,。添加类规则元素必须包含paymentDateField类

三,。实现validatePaymentDate函数:

该函数可以重构以消除如此多的循环,但它产生了预期的效果。只有顺序错误的日期字段被标记为无效

$.validator.addMethod("paymentDate", function(value, element) {
    return this.optional(element) || validatePaymentDate(value, element);
}, "Payment Date(s) is required, must be in date format, and must be in order");
$.validator.addClassRules({
    paymentDateField: {
        required: true,
        date: true,
        paymentDate: true
    }
});
function validatePaymentDate(value, element) {
    var paymentDates = $('.paymentDateField');
    var dateArray = new Array();
    var arrayIndex = 0;
    var currentElementIndex = 0;
    var isValid = true;

    $(paymentDates).each(function() {
        var currentElementVal = $(this).val();
        dateArray[arrayIndex] = currentElementVal;

        if (currentElementVal == $(element).val()) {
            currentElementIndex = arrayIndex;
            return false;
        }

        arrayIndex++;
    });

    for (var x = 0; x <= arrayIndex; x++) {
        console.log('array val: ' + dateArray[x]);
        console.log('dateVal: ' + value);

        if (x > currentElementIndex) {
            isValid = new Date(dateArray[x]) > new Date(value);
        }

        if (x < currentElementIndex) {
            isValid = new Date(dateArray[x]) < new Date(value);
        }
    }

    return isValid;
}