1

がピッキングされたとき、私は のために3-7 日from-dateの可能性があることを望んでいます。したがって、from-to は and である必要があります。どうやってやるの？to-datemin 3 daysmax 7 days

 $(function() {
  $.datepicker.setDefaults({minDate: 0, changeMonth: true, numberOfMonths: 1});
  $('#datepicker').datepicker({onSelect: function(selectedDate) {
        $('#datepicker').datepicker('option', 'minDate', selectedDate);
        setTimeout(function() { $('#datepicker1').focus(); }, 0);
  }});
  $('#datepicker1').datepicker({onSelect: function(selectedDate) {
        $('#datepicker1').datepicker('option', 'maxDate', selectedDate);
  }});
});
4

2 に答える 2

1

from-to は、最短で 3 日、最長で 7 日である必要があります

最初の日付ピッカーで日付が選択されている場合は、他の日付ピッカーのminDateとを設定する必要があります。これは、イベント ハンドラーmaxDateで行う必要があることを正しく理解したとおりです。onSelect

ただし、渡されるパラメータonSelectは文字列であることに注意してください。したがって、 を使用して日付を抽出し、getDateそれを使用して 3 ～ 7 日の範囲を定義すると、より簡単になります。

以下に例を示します。

$("#fromDate").datepicker({ 
    dateFormat: "yy-mm-dd", 
    onSelect: function() {

        // define a range object
        var dateRange = {min:null, max:null}, 

        // get the selected date from the first datepicker
            selectedDate = $('#fromDate').datepicker('getDate');

        dateRange.min = selectedDate.getDate() + 3; // add 3 days for min
        dateRange.max = selectedDate.getDate() + 7; // add 7 days for max

        // assign min and max to minDate and maxDate of second datepicker
        $('#toDate').datepicker('option', 'minDate', dateRange.min);
        $('#toDate').datepicker('option', 'maxDate', dateRange.max);

        // set the focus to the second datepicker
        setTimeout(function() { $('#toDate').focus(); }, 0);
    }
});

フィドル: http://jsfiddle.net/abhitalks/ryhkkap3/

スニペット:

$("#fromDate").datepicker({ 
    dateFormat: "yy-mm-dd", 
    onSelect: function() {
        var dateRange = {min:null, max:null},
        	selectedDate = $('#fromDate').datepicker('getDate');
        dateRange.min = selectedDate.getDate() + 3;
        dateRange.max = selectedDate.getDate() + 7;
        $('#toDate').datepicker('option', 'minDate', dateRange.min);
        $('#toDate').datepicker('option', 'maxDate', dateRange.max);
        setTimeout(function() { $('#toDate').focus(); }, 0);
    }
});
$("#toDate").datepicker({ dateFormat: "yy-mm-dd" });
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<input id="fromDate" />
<input id="toDate" />

.

于 2015-12-01T07:28:17.963 に答える
1

次のような簡単なことを行うことができます。

$('#datepicker').datepicker({onSelect: function(selectedDate) {
      var newToDateStart=new Date(selectedDate);//convert selectedDate to Date object
      newToDateStart.setDate(newToDateStart.getDate()+3) //todate start
      var newToDateEnd=new Date(selectedDate);
      newToDateEnd.setDate(newToDateEnd.getDate()+7);//todate end
      $('#datepicker1').datepicker('option', 'minDate', newToDateStart);
      $('#datepicker1').datepicker('option', 'maxDate', newToDateEnd);
      //set min and maxdate to datepicker1
      setTimeout(function() { $('#datepicker1').focus(); }, 0);
}});

デモはこちら

于 2015-12-01T07:29:46.220 に答える