JQuery UI Datepicker Добавить дни - PullRequest
Новая
       10

JQuery UI Datepicker Добавить дни

3 голосов
/ 28 сентября 2010

Я пытаюсь создать систему бронирования номеров на сайте отеля и использую jQuery UI Datepicker, чтобы позволить пользователю выбрать дату регистрации. Затем я хочу создать еще одно простое поле «Количество ночей» и заставить jQuery Datepicker принять дату регистрации, добавить количество ночей и установить итоговую дату в качестве значения скрытого ввода (в правильной дате формат). Это будет выглядеть примерно так: 

<input type="text" name="arrivalDate" class="datepicker">
<input type="text" name="numOfNights">
<input type="hidden" name="departureDate" value="arrivalDate + number of nights">

Возможно ли это? Заранее спасибо.

(Примечание: база данных, из которой я буду получать эту форму, немного темпераментна, и у меня нет доступа к ней, кроме нескольких значений, доступных для запросов.)

Ответы [ 3 ]

9 голосов
/ 28 сентября 2010

Выше может быть достигнуто с помощью следующего кода - 

 $('input[name="arrivalDate"]').datepicker({

     //your other configurations.     

     onSelect: function(){
     var start = $('input[name="arrivalDate"]').val();
     var nights = $('input[name="numOfNights"]').val();
     var date = new Date(start);
     var d = date.getDate();
     var m = date.getMonth();
     var y = date.getFullYear();
     var edate= new Date(y, m, d+nights);
     $('input[name="departureDate"]').val(edate);
    }
 });
6 голосов
/ 28 сентября 2010

Вы можете обновить значение скрытого поля в событиях onSelect для средства ввода даты dateDate. 

$('#arrivalDate').datepicker({
    onSelect: function(dateStr) {
        var nights = parseInt($('#numOfNights').val());
        var depart = $.datepicker.parseDate('mm/dd/yy', dateStr);
        depart.setDate(depart.getDate() + nights);
        $('#departureDate').val(depart);
     }
});

Вам также необходимо обновить поле DepartDate из события изменения поля numOfNights. 

$('#numOfNights').change(function() {
        var nights = parseInt($('#numOfNights').val());
        var depart = $.datepicker.parseDate('mm/dd/yy', $('#arrivalDate').val());
        depart.setDate(depart.getDate() + nights);
        $('#departureDate').val(depart);
});

Попробуйте здесь: http://jsfiddle.net/JKGvD/

Возможно, вы захотите сделать это функцией, а также использовать ее для инициализации даты вылета, если ваше значение даты прибытия имеет начальное значение.

1 голос
/ 28 сентября 2010

Используйте функцию setDate .

SETDATE

Подпись: .datepicker ("setDate", date)

Устанавливает текущую дату для DatePicker. Новая дата может быть датой объект или строка в текущей дате формат (например, «01/26/2009»), число дней с сегодняшнего дня (например, +7) или строка значений и периодов ('y' для лет, «м» за месяцы, «w» за недели, 'd' в течение нескольких дней, например '+ 1m + 7d') или ноль очистить выбранную дату.

...