3

I have a requirement where I will have 2 date fields (to, from) and needs to validate them:

  • whether they are mm/dd/yyyy format
  • both the dates are in particular range
  • as the name suggests to should always be greater than from
  • both fields become mandatory as soon as i enter any one of these

what will be the best way to implement the same, am using jquery validation api

Note: I did read about format validation on some of the links like jQuery Date Validation (YYYY-MM-DD) but these doesnt ensure that its a valid date I may end up entering something like 02/31/2999

i tried 

jQuery.validator.addMethod("DateFormat", function(value, element) {
    var date_regex = /^(0[1-9]|1[0-2])\/(0[1-9]|1\d|2\d|3[01])\/(19|20)\d{2}$/ ;
    var values = value.split("/");
    return this.optional(element) || (value.test(date_regex) && (new Date(values[2], values[0], values[1])));
});
4

2 回答 2

2

我们已经几乎完全处理了这个问题。您需要做的是创建一系列验证规则。首先，你给日期一些适当的类属性——比如“fromDate”和“toDate”。

  • 使用正则表达式来确保它们的格式正确的一种
  • 一个使用 javascript Date 对象进行日期转换的日期，并确保它们在正确的范围内。
  • 一个用于起始日期，它知道如何找到截止日期（通常通过上升一两个级别来处理，然后.find('input.toDate'))在其上运行或类似，并比较它们。
  • 迄今为止，另一个相反。
  • 如果两者都为空，则返回 true，但如果一个为空，另一个为满，则返回 false

然后使用 .将适当的规则分配给适当的类jQuery.validate.addClassRules()。

在您在相关表单上设置验证器之前放置所有这些代码，它应该可以正常工作。语法留给读者作为练习。

于 2013-06-14T02:17:48.323 回答
0

添加了后续验证方法

// jquery validation method to validate date format
jQuery.validator.addMethod("DateFormat", function(value, element) {
    var date_regex = /^(0[1-9]|1[0-2])\/(0[1-9]|1\d|2\d|3[01])\/(19|20)\d{2}$/ ;
    var comp = value.split('/');
    var m = parseInt(comp[0], 10);
    var d = parseInt(comp[1], 10);
    var y = parseInt(comp[2], 10);
    var date = new Date(y,m,d);
    return this.optional(element) || (date_regex.test(value) && date.getFullYear() == y && date.getMonth() == m && date.getDate() == d);
});
//jquery validation method to validate date range
jQuery.validator.addMethod("DateToFrom", function(value, element, arg0, arg1) {
    var comp = value.split('/');
    var m = parseInt(comp[0], 10);
    var d = parseInt(comp[1], 10);
    var y = parseInt(comp[2], 10);
    var currentEltdate = new Date(y,m,d);

    comp = $("#"+arg0).val().split('/');
    m = parseInt(comp[0], 10);
    d = parseInt(comp[1], 10);
    y = parseInt(comp[2], 10);
    var otherEltDate = new Date(y,m,d);

    var lowerDate, upperDate;
    if(arg1 == true){//current element should be lower date
        lowerDate = currentEltdate;
        upperDate = otherEltDate;
    }else{
        lowerDate = otherEltDate;
        upperDate = currentEltdate;
    }
    return this.optional(element) || (lowerDate <= upperDate);
});
// jquery validation method to validate date range
jQuery.validator.addMethod("DateRange", function(value, element, arg0, arg1) {
    var comp = arg0.split('/');
    var m = parseInt(comp[0], 10);
    var d = parseInt(comp[1], 10);
    var y = parseInt(comp[2], 10);
    var startDate = new Date(y,m,d);

    comp = arg1.split('/');
    m = parseInt(comp[0], 10);
    d = parseInt(comp[1], 10);
    y = parseInt(comp[2], 10);
    var endDate = new Date(y,m,d);

    comp = value.split('/');
    m = parseInt(comp[0], 10);
    d = parseInt(comp[1], 10);
    y = parseInt(comp[2], 10);
    var date = new Date(y,m,d);

    return this.optional(element) || ((startDate <= date) && (date <= endDate));
});
于 2013-06-18T07:45:58.843 回答