0

ホテルの日付を選択するために日付ピッカーを使用しています。ユーザーが両方のカレンダーで同じ日を選択できないようにするには、日付ピッカーが必要です。

これがどのように機能するかです: - 「開始日」より前の「終了日」を追加することはできません - 「開始日」と「開始日」の両方に同じ日を選択することはできません

これは私が持っているコードです:

$( "#booking-from" ).datepicker({
    defaultDate: "+1w",
    minDate: 0,
    firstDay: 0,
    dateFormat: 'dd-mm-yy',
    changeMonth: true,
    numberOfMonths: 1,
    onClose: function( selectedDate ) {
        //$( "#booking-to" ).datepicker( "option", "minDate", selectedDate );           
        /*var day1 = $("#booking-from").datepicker('getDate').getDate() + 1;                 
        var month1 = $("#booking-from").datepicker('getDate').getMonth();             
        var year1 = $("#booking-from").datepicker('getDate').getFullYear();
        year1 = year1.toString().substr(2,2);
        var fullDate = day1 + "-" + month1 + "-" + year1;*/         

        $( "#booking-to" ).datepicker( "option", "minDate", selectedDate );
    }
});
$( "#booking-to" ).datepicker({
    defaultDate: "+1w",
    minDate: '+2d',
    changeMonth: true,
    firstDay: 0,
    dateFormat: 'dd-mm-yy',
    numberOfMonths: 1,
    onClose: function( selectedDate ) {
        //$( "#booking-from" ).datepicker( "option", "maxDate", $('#booking-to').datepicker('getDate') );
    },
    onSelect: function (){
        calculateBooking();
    }
});

$("#booking-from").datepicker('setDate', '+1');
$("#booking-to").datepicker('setDate', '+8');

どうすればできますか？

4

2 に答える 2

0

onClose日付ピッカーのイベントでこの 3 行を使用しますfrom。これには、日付形式を変更する必要はありません。

onClose: function( selectedDate ) {         
    var minDate = $(this).datepicker('getDate');
    var newMin = new Date(minDate.setDate(minDate.getDate() + 1));
    $( "#booking-to" ).datepicker( "option", "minDate", newMin );
}

jsfiddle demo

編集

逆に同じ動作が必要な場合は、ピッカーのonCloseイベントにこれを含めます。to

onClose: function( selectedDate ) {
    var maxDate = $(this).datepicker('getDate');
    var newMax  = new Date(maxDate.setDate(maxDate.getDate() - 1));
    $( "#booking-from" ).datepicker( "option", "maxDate",  newMax);
}

updated fiddle

于 2013-08-12T15:02:50.827 に答える
0

日付形式を ISO ( yy-mm-dd) に変更すると、JavaScriptDateオブジェクトを利用して別の日付を簡単に追加できます。

var actualDate = new Date(selectedDate);
var newDate = new Date(actualDate.getFullYear(), actualDate.getMonth(), actualDate.getDate()+1);  
$( "#booking-to" ).datepicker( "option", "minDate", newDate );

実際のデモ: http://jsfiddle.net/h3wGx/1/

元の日付形式を保持したい場合は、jQuery Datepicker の altFormat オプションを使用できます: http://api.jqueryui.com/datepicker/#option-altFormat

于 2013-08-12T14:58:12.127 に答える