2017-06-16 26 views
1

ユーザーが別の日付ピッカー(つまり、チェックイン/チェックアウトの日付)から選択した日付を使用してdatepickerのminDateを設定しようとしています。javadriptのdatepickerにminDateを設定する

ここに私のコードです:

var checkin = document.getElementById('check-in'); 
var checkout = document.getElementById('check-out'); 

var dateField; 

$('#check-in').datepicker({ 
    onSelect: function (date) { 
    dateField = $(this).val(); 
    console.log(date); 
    }, 
    altField: '#actual-checkin-date', 
    altFormat: 'mm/dd/yy', 
    dateFormat: 'dd/mm/yy', 
    minDate: 0 
}); 

$('#check-out').datepicker({ 
    altField: '#actual-checkout-date', 
    altFormat: 'mm/dd/yy', 
    dateFormat: 'dd/mm/yy', 
    minDate: new Date(dateField) 
}); 

checkin.onclick = function() { 
    $('#check-in').datepicker(); 
}; 

checkout.onclick = function() { 
    $('#check-out').datepicker(); 
    console.log($('#check-out').datepicker("option", "minDate")); 
} 

私はチェックインの日付ピッカー正しくから日付をログに記録することができますが、私はチェックアウト日付ピッカーのMinDateプロパティとしてその日付を設定することはできません。最後のデータピッカーのログには「無効な日付」が表示され、最初のデータピッカーのログにはdd/mm/yy形式の日付が表示されます。

私は間違っていますか?

ありがとうございました!

答えて

1

あなたはここでは2つの問題に実行している:あなたのデータフィールドがまだ定義されていないDatePickerのあなたのチェックインには、データを選択すると(それが)設定されます作成され 1)あなたがチェックアウト日付ピッカーを作成

2)あなたは、有効な日付を作成していない - あなたは$('#check-in').datepicker("getDate")

を使用して日付ピッカーの日付にアクセスすることができますが、このバイオリンを見てみましょう:http://jsfiddle.net/nerL43s5/をアクションでそれを見るために。

$('#check-in').datepicker({ 
    onSelect: function(date) { 
    console.log(date); 
    // now you have a date you can set as the minDate: 
    $('#check-out').datepicker('option', 'minDate', $('#check-in').datepicker('getDate')); 
    console.log($('#check-out').datepicker('option', 'minDate')); 
    }, 
    altField: '#actual-checkin-date', 
    altFormat: 'mm/dd/yy', 
    dateFormat: 'dd/mm/yy', 
    minDate: 0 
}); 
+1

これはうまくいきました。ありがとうございました! :) – CallMeDeftsu4

関連する問題