如何显示日期取决于日期

时间:2018-07-18 08:14:40

标签: javascript jquery datepicker jquery-ui-datepicker

我有两个日期选择器。我想显示to的日期取决于from的日期。 To日期应该是from date加1以后的日期。FromTo日期不相同。 To的日期总是从from date的第二天开始。

示例:

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

所以我想在date of date之后显示。

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>

1 个答案:

答案 0 :(得分:1)

尝试下面的代码

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 ]
    }

    });