Выполнить событие .bind onLoad для Jquery Date Picker

Question

Я использую kelvin lucks jquery date picker .

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

Прекрасно работает, кроме случаев, когда вы выбираете дату окончания, не касаясь даты начала, вы можете установить дату окончания до даты начала.Не хорошо!

$(function()
{
    $('.date-pick').datePicker({startDate:'2000-01-01', clickInput:true})

        $('#start-date').bind('dpClosed', function(e, selectedDates) {
                var d = selectedDates[0];
                if (d) {
            d = new Date(d);
            $('#end-date').dpSetStartDate(d.addDays(0).asString()).dpSetSelected(d.asString()).val($(this).val());
        }
    });
});

Поскольку я предварительно заполняю поля ввода с помощью PHP, все, что я хочу сделать, это вызвать $('#end-date').dpSetStartDate, чтобы дата окончания обновлялась при загрузке документа.На данный момент он обновляется только на $('#start-date').bind('dpClosed', function(e, selectedDates) {

Как мне это сделать?

Спасибо,

Тим

Answer 1

К сожалению, вы не можете просто вызвать событие, потому что вы пытаетесь набрать selectedDates из аргументов ... однако есть другой способ получить эти данные: $('#start-date').dpGetSelected(). Используя это, вы можете .trigger() событие, когда вы хотите (немедленно) обновить диапазон #end-date, например:

$(function() {
    $('.date-pick').datePicker({startDate:'2000-01-01', clickInput:true});
    $('#start-date').bind('dpClosed', function(e, selectedDates) {
      var d = $('#start-date').dpGetSelected()[0];
      if (d) {
       d = new Date(d);
       $('#end-date').dpSetStartDate(d.addDays(0).asString()).dpSetSelected(d.asString()).val($(this).val());
     }
   }).trigger('dpClosed'); //call that event handler we just bound
});

Вы можете проверить это здесь .

Answer 2

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

Чтобы сделать это, вы 'Вам нужно будет привязать событие dpClosed для обоих средств выбора даты и выполнить что-то вроде этой логики (псевдокод):

var start = getSelectedStartDate();
var end = getSelectedEndDate(); //you'll need to write these functions, but you get the idea
if (end < start) {
  // set the end date field to the selected start date
  $("#end-date").dpSetSelected(start); //not sure if this is the only thing you have to do, but again, you get the idea
}

Таким образом, идея заключается в том, что, если когда-либо дата окончания будет предшествовать дате началакогда пользователь выбирает дату в любом поле, дата начала будет помещена в поле даты окончания.