Изменить отображаемый месяц в jQuery datepicker, в зависимости от другого экземпляра datepicker - PullRequest
Новая
       4

Изменить отображаемый месяц в jQuery datepicker, в зависимости от другого экземпляра datepicker

5 голосов
/ 15 марта 2011

У меня есть два поля DatePicker, одно из них ' дата начала ', другое ' end_date '.

Мне бы хотелось, чтобы после того, как пользователь выбрал ' дата начала ', календарь ' дата окончания ' по умолчанию должен показывать месяц, содержащий' дата начала '.

Напротив, если пользователь впервые выберет дата окончания , календарь на дату начала должен показывать месяц, содержащийвыбрано дата окончания .

как реализовать внутри jQuery datepicker?Какие параметры выбора даты я должен определить? 

$("#start_date").datepicker({
  //which datepicker options should put here?
})

Ответы [ 3 ]

6 голосов
/ 15 марта 2011

Это устанавливает дату по умолчанию другого календаря, как вы хотите. Если дата уже выбрана, она не изменится. 

    $(document).ready(function() {
        $( "#datepicker" ).datepicker({onSelect: function(dateText, inst) {
            $( "#datepicker2" ).datepicker( "option", "defaultDate", dateText );
        }});
        $( "#datepicker2" ).datepicker({onSelect: function(dateText, inst) {
            $( "#datepicker" ).datepicker( "option", "defaultDate", dateText );
        }});
    });

Если вы хотите заставить другой сборщик дат сбросить уже выбранную дату на другой месяц календаря, используйте это: 

$(document).ready(function() {
        $( "#datepicker" ).datepicker({onSelect: function(dateText, inst) {
            $( "#datepicker2" ).datepicker( "setDate" , dateText )
        }});
        $( "#datepicker2" ).datepicker({onSelect: function(dateText, inst) {
            $( "#datepicker" ).datepicker( "setDate" , dateText )
        }});
});
1 голос
/ 15 марта 2011

Вы можете попробовать это, чтобы пользователь не выбрал end-date меньше start-date и start-date больше end-date. 

    $("#start_date").datepicker({
        defaultDate: '-7d',
        changeMonth: true,
        changeYear: true,
        onSelect: function (dateStr) {
            $("end-date").datepicker('option', 'minDate', $(this).datepicker('getDate') || '-1m');
        }
    });
    $("end-date").datepicker({
        defaultDate: new Date(),
        changeMonth: true,
        changeYear: true,
        onSelect: function (dateStr) {
            $("#start_date").datepicker('option', 'maxDate', $(this).datepicker('getDate') || 0);
        }
    });
0 голосов
/ 15 марта 2011

Я предлагаю сохранить выбранную дату в datepicker1 и, прежде чем показывать datepicker2, вручную установить ту же дату. Итак, datepicker1.date == datepicker2.date. Я надеюсь, что это поможет вам. 

var dateselected = '';

$( "#datepicker1" ).datepicker({
  onSelect: function(dateText, inst) {
    dateselected = dateText;
  } 
});
$( "#datepicker2" ).datepicker({
  beforeShow: function(input, inst) {
    if(dateselected != '')
       $( "#datepicker2" ).datepicker('setDate',dateselected);
  } 
});

Вы можете увидеть его по следующей ссылке: http://jsbin.com/orizi4

...