时间戳

首页 > 解决方案 > 如何显示日期取决于从日期

javascript - 如何显示日期取决于从日期

问题描述

我有两个日期选择器。我想显示to日期取决于from日期。To日期应该是从from date加 1开始From的未来日期。To日期不一样。To日期总是从 的第二天开始from date。

例子： 

If I select `from` 07/18/2018 `to` date do not like from 07/18/2018.

所以我想在日期之后显示。

If I select `from` 07/18/2018 `to` date will start like from 07/19/2018.

如果你看到我的 JSFiddle 你可以理解：http: //jsfiddle.net/FdfPY/771/

JavaScript：

  var disabledDates = []
  $(".from_date").datepicker({
  minDate: 'D',
  dateFormat: "dd/mm/yy",
  defaultDate: "+1w",
  numberOfMonths: 1,
        beforeShowDay: function(d) { 
        if (d.getDate() == 2 || d.getDate() == 16) {
          return [true, "" ];
        } else {
           return [false, "" ];
        }
     },
  onClose: function(selectedDate) {
  disabledDates=[selectedDate];
    $(".to_date").datepicker("option", "minDate", selectedDate); 
  }
  });

  $(".to_date").datepicker({
  minDate: 0,
  dateFormat: "dd/mm/yy",
  defaultDate: "+1w",
  numberOfMonths: 1,
        beforeShowDay: function(d) {  

        if (d.getDate() == 2 || d.getDate() == 16) {
          return [true, "" ];
        } else {
           return [false, "" ];
        }
     } 
    });

HTML： 

<div id="nested-fields row">
  <div class="span2">
    <div class="control-group">
      <label>From</label>
      <div class="controls">
        <input type="text" class="from_date" />
      </div>
    </div>
  </div>
  <div class="span2">
    <div class="control-group">
      <label>To</label>
      <div class="controls">
        <input type="text" class="to_date" />
      </div>
    </div>
  </div>
  <div style="clear:left"></div>
</div>

标签： javascriptjquerydatepickerjquery-ui-datepicker

解决方案

试试下面的代码

var disabledDates = []
$(".from_date").datepicker({
      minDate: 'D',
      dateFormat: "dd/mm/yy",
      defaultDate: "+1w",
      numberOfMonths: 1,
      onClose: function(selectedDate) {
      disabledDates=[selectedDate];
        $(".to_date").datepicker("option", "minDate", selectedDate); 
      }
    });

 $(".to_date").datepicker({
      minDate: 0,
      dateFormat: "dd/mm/yy",
      defaultDate: "+1w",
      numberOfMonths: 1,
       beforeShowDay: function(date){
        var string = jQuery.datepicker.formatDate('dd/mm/yy', date);
        return [ disabledDates.indexOf(string) == -1 ]
    }

    });

推荐阅读