使用引导日期选择器进行日期验证答案

【问题标题】：Date validations with bootstrap datepicker使用引导日期选择器进行日期验证
【发布时间】：2016-04-15 09:00:36
【问题描述】：

使用引导日期选择器。 StartDate 和 EndDate 有两个文本框。当用户更改这两个文本框中的任何一个中的日期时，我正在尝试设置验证。在页面加载时，两个框都有当前日期。

测试用例：
当用户设置..
1. startDate 超出当前日期，设置 startDate=endDate
2. startDate 超出 endDate，设置 endDate=startDate
3. endDate 超出当前日期，设置 endDate=current Date
4. endDate低于startDate，设置startDate=endDate

案例 1 失败。假设今天是 2016 年 1 月 11 日，我将 startDate 设置为 2016 年 1 月 12 日，它不会更改为 2011 年 1 月 11 日，而是保持为 2016 年 1 月 12 日。

此外，案例 3 失败。

我的逻辑有问题。

这是小提琴 - http://jsfiddle.net/snh6eh9p/2/

JS：

function validateDates(dateType) {
  //dateType is to know if this function was fired by changing startdate or enddate
  //end-date must always be >= start-date
  var today = new Date();
  var startDate = new Date($(".txtStartDate").val());
  var endDate = new Date($(".txtEndDate").val());

  switch (dateType) {
    case 1:
    case "1":
      //if startDate is changed
      if (startDate > today) {
        setTriggerDates(endDate, 1); //set startDate=enddate         
      } else if (startDate > endDate) {
        setTriggerDates(startDate, 2); //set endDate=startDate
      }
      break;
    case 2:
    case "2":
      //if endDate is changed                    
      if (endDate > today) {
        setTriggerDates(today, 2); //set endDate=today
      } else if (endDate < startDate) {
        setTriggerDates(endDate, 1); //set startDate=endDate
      }
      break;
  }
}

function setTriggerDates(newDate, applyTo) {
  //applyTo determines, which textfield the value should be applied to.
  //if 1, then change value of txtStartDate,
  //if 2, then change value of txtEndDate  

  //populate date into the date fields
  var today = new Date(newDate);
  var dd = today.getDate();
  var mm = today.getMonth() + 1; //January is 0!
  var yyyy = today.getFullYear();

  if (dd < 10) {
    dd = '0' + dd
  }

  if (mm < 10) {
    mm = '0' + mm
  }

  today = yyyy + '-' + mm + '-' + dd;

  switch (applyTo) {
    case 1:
    case "1":
      $(".txtStartDate").val(today);
      break;
    case 2:
    case "2":
      $(".txtEndDate").val(today);
      break;
  }
}

【问题讨论】：

标签： javascript jquery asp.net bootstrap-datepicker

【解决方案1】：

更新了您的 jsfiddle 以解决问题 http://jsfiddle.net/snh6eh9p/4/。

我所做的唯一更改是在 hide 事件而不是 changeDate 事件上调用 validateDates

$(".txtStartDate").datepicker()
.on("hide", function(ev) {
    validateDates(1);
});

$(".txtEndDate").datepicker()
.on("hide", function(ev) {
    validateDates(2);
});

【讨论】：