Вопрос по twitter-bootstrap-3, wordpress, datepicker, javascript, jquery – Bootstrap Datepicker Отключить прошлые даты после установки первого поля даты

3

Я работаю над сайтом Wordpress с темой, основанной на Bootstrap 3.

В форме мне нужно включить календарь даты выбора. Я добавил библиотеку js из eyecon(Демо-сайт для библиотеки Datepicker), Я сделал это работать с селекторами даты, но яУ меня возникли проблемы с отключением выбора времени для поля прибытия, когда установлено время отправления.

Например, если время отправления установлено на 1 марта, когда пользователь нажимает на поле «Прибытие» в всплывающем календаре, все даты до 2 марта должны быть отключены.

Я попробовал несколько версий кода, приведенных на демонстрационном сайте, но они нет работа. Я думаю, что проблема может быть в том, что у меня есть jQuery в режиме noConflict.

Мой текущий скрипт находится в footer.php моей темы. Всплывающий календарь работает, и он отключает прошлые даты, но это неt отключить даты перед полем «Прибытие» после того, как установлена дата отправления.

Это была самая успешная попытка, так как по крайней мере всплывающие окна календаря работали над этой попыткой:http://jsfiddle.net/j5ZKc/

И это мой текущий скрипт:


jQuery(function() {
  jQuery('#dp1, #dp2'
  ).datepicker({startDate: '-0m'}).on('changeDate', function(){
    jQuery( '#dp1, #dp2'
    ).datepicker('hide');
  })
});

Любые предложения, пожалуйста?

Итак, я попытался изменить ваш код, чтобы он работал в jsFiddle ... не добился этого, но я получил его в моей локальной среде. Я не слишком сильно модифицировал код из примера, и это сработало. snrlx
Не могли бы вы отредактировать свой пост и показать, как вы это сделали. Тогда я могу попытаться исправить ваши ошибки. snrlx
Да, я пытался использовать его, но, возможно, не смог получить правильный синтаксис для js, так как мне пришлось использовать его в режиме noConflict, используя jQuery вместо $ Domeniko
На данной демо-странице есть пример регистрации. Вы попробовали это, и это нет работаешь? Это выглядит разумно для меня. snrlx
Я отредактировал свой пост, добавил ссылку из jsfiddle. Спасибо @nvrmnd:)) Domeniko

Ваш Ответ

2   ответа
5

$('#changestartdate').datetimepicker({ minDate:new Date() });

minDate все еще работает для меня Utsav T
startDate работал отлично !!! @RossEdman drowsyTicker
Я должен был использовать minDate поверх startDate: startDate выдает консольную ошибку jsUncaught TypeError: option startDate is not recognized! Nubtacular
minDate был обновлен доstartDate для тех, кто смотрит на это недавно. Ross Edman
9

Итак, после некоторых неприятностей я наконец-то получил что-то для вас:

jsFiddle Bootstrap-datepicker

Что я сделал:

я использовалразветвленный Bootstrap-datepicker, На мой взгляд, это лучше документировано и проще в использовании. Я получил это работает, так что должно что-то значить. Например, я получил дату соответствующего выбора даты, вызвавgetDate() на странице выбора даты:

checkout.datepicker("getDate").valueOf()

Если у вас есть вопросы по поводу моего кода, дайте мне знать!

РЕДАКТИРОВАТЬ:

Я обновил бывший jsFiddle (см. Ссылку выше). Он автоматически устанавливает значение # dp2 для выбранной даты # dp1 + один день. Поэтому вы всегда должны быть в правильном месяце.

Если вы неЕсли вы хотите, чтобы код фокусировался на # dp2 после выбора даты, просто удалите следующую строку в jsFiddle:

$('#dp2')[0].focus();
Я отредактировал jsFiddle, чтобы удовлетворить ваши потребности. Если вы хотите использовать 4 разных средства выбора даты, тогда, конечно, вам нужно сделать несколько небольших модификаций, но это должно быть довольно легко сделать. snrlx
Я принял ответ, но пока не могу его проголосовать. Вернусь к этому ответу, как только у меня будет достаточно репутации, чтобы проголосовать за него ... Еще раз спасибо ... Ура! :) Domeniko
Спасибо @nvrmnd Кто-нибудь когда-нибудь говорил вам, что вы его герой? :)) Ну, сэр ... Вы мой герой: D Теперь все, что мне нужно выяснить, это как продублировать этот скрипт для моей другой страницы, где у меня есть несколько полей для календаря, для нескольких мест назначения. Я предполагаю, что простое копирование и изменение имен идентификаторов в скрипте должно делать эту работу правильно? Еще раз большое спасибо! :) Domeniko
Другой вопрос, который я имею, как я могу отключить автоматический переход на дату прибытия, как только будет установлена дата отъезда (# dp1)? И будет ли этот скрипт работать для нескольких полей? Допустим, у меня есть 3 даты отъезда и 1 прибытие? Большое спасибо @nvrmnd. Я очень ценю вашу помощь! :) Domeniko

Похожие вопросы