bananovsv Опубликовано 14 марта, 2017 Жалоба Поделиться Опубликовано 14 марта, 2017 Здравствуйте, господа! У меня два простых вопроса. Помогите разобраться. 1. Есть селект с такой логикой: <select name="delivery_date"> <option value="">{'+0 day'|date_format:'%d %m %y'}</option> <option value="">{'+1 day'|date_format:'%d %m %y'}</option> <option value="">{'+2 day'|date_format:'%d %m %y'}</option> <option value="">{'+3 day'|date_format:'%d %m %y'}</option> <option value="">{'+4 day'|date_format:'%d %m %y'}</option> … <option value="">{'+30 day'|date_format:'%d %m %y'}</option> </select> Вопрос: как запихнуть это в цикл? 2. Есть второй селект: <select name="delivery_time"> <option value="">10:00–14:00</option> <option value="">14:00–18:00</option> <option value="">18:00–22:00</option> </select> Вопрос: как сделать проверку, чтобы если в первом селекте выбран первый вариант, то во втором селекте первый вариант скрывался или становился неактивным? (Чтобы сегодня доставка с 10 до 14 была недоступна.) Цитата Ссылка на сообщение Поделиться на другие сайты
ABSORBER Опубликовано 14 марта, 2017 Жалоба Поделиться Опубликовано 14 марта, 2017 1. Есть селект с такой логикой:Вопрос: как запихнуть это в цикл? <select name="delivery_date"> {for $i = 0 to 30} <option value="">{"+{$i} day"|date_format:'%d %m %y'}</option> {/for} </select> <select name="delivery_time"> <option value="" disabled>10:00–14:00</option> <option value="">14:00–18:00</option> <option value="">18:00–22:00</option> </select> 2. Я бы сделал через JS (написал на скорую руку). $(document).on('change', '[name="delivery_date"]', function () { var delivery_time = $('[name="delivery_time"]'), date_index = $(this).find(":selected").index(); if(date_index == 0) delivery_time.find('*').eq(0).prop( "disabled", true ); else delivery_time.find(":disabled").prop( "disabled", false ); }); Цитата Ссылка на сообщение Поделиться на другие сайты
bananovsv Опубликовано 14 марта, 2017 Автор Жалоба Поделиться Опубликовано 14 марта, 2017 Absorber, супер, спасибо. Как сделать, чтобы скрипт срабатывал и при загрузке страницы, а не только при изменении? Цитата Ссылка на сообщение Поделиться на другие сайты
Noxter Опубликовано 14 марта, 2017 Жалоба Поделиться Опубликовано 14 марта, 2017 Absorber, супер, спасибо. Как сделать, чтобы скрипт срабатывал и при загрузке страницы, а не только при изменении?Так ведь по дефолту в списках первый элемент всегда активный. Цитата Ссылка на сообщение Поделиться на другие сайты
bananovsv Опубликовано 14 марта, 2017 Автор Жалоба Поделиться Опубликовано 14 марта, 2017 Noxter, это замечание не связано с моей задачей. Цитата Ссылка на сообщение Поделиться на другие сайты
Noxter Опубликовано 14 марта, 2017 Жалоба Поделиться Опубликовано 14 марта, 2017 Noxter, это замечание не связано с моей задачей.Не правильно понял, сделайте во втором списке первый элемент с параметром disabled, а уже при переключении убирайте этот параметр, тогда при загрузке страницы у вас в первом списке будет выбран первый элемент, а во втором первый элемент будет недоступен. Цитата Ссылка на сообщение Поделиться на другие сайты
bananovsv Опубликовано 14 марта, 2017 Автор Жалоба Поделиться Опубликовано 14 марта, 2017 Noxter, мне так не подойдет — у меня данные формы восстанавливаются автоматически из локал-стораджа. И это событие не будет засчитано как on change. Может быть ситуация, что в первом селекте восстановится не первое значение, а у второго селекта останется disabled. Ну ладно, дальше разберусь, всем спасибо. Цитата Ссылка на сообщение Поделиться на другие сайты
yr4ik Опубликовано 14 марта, 2017 Жалоба Поделиться Опубликовано 14 марта, 2017 в конце добавить .change() $(document).on('change', '[name="delivery_date"]', function () { var delivery_time = $('[name="delivery_time"]'), date_index = $(this).find(":selected").index(); if(date_index == 0) delivery_time.find('*').eq(0).prop( "disabled", true ); else delivery_time.find(":disabled").prop( "disabled", false ); }).change(); а вообще я бы лучше реализовал через какой нибудь плагинhttp://xdsoft.net/jqplugins/datetimepicker/или http://trentrichardson.com/examples/timepicker/ Цитата Ссылка на сообщение Поделиться на другие сайты
bananovsv Опубликовано 14 марта, 2017 Автор Жалоба Поделиться Опубликовано 14 марта, 2017 Yr4ik, мне больше по душе нативные селекты. Добавление .change() ничего не изменило. Цитата Ссылка на сообщение Поделиться на другие сайты
yr4ik Опубликовано 14 марта, 2017 Жалоба Поделиться Опубликовано 14 марта, 2017 (изменено) аа точно) немного не досмотрел как у вас реализовано. некогда не понимал такого подхода: $(document).on('change', '[name="delivery_date"]', function (){ ведь разработчики jquery не тупые...Они не зря удалили метод live который работал точно так же как и эта строка.Данный подход делает отлов кликов по всей страницы. Что совсем не нужно... если область не динамична (не подгружается аяксом и тд) делаем просто: $('[name="delivery_date"]').change(function(){ и change() в конце заработает. Если же область динамическая то: $(тут пишем селектор динамичной области).on('change', '[name="delivery_date"]', function (){ и для вызова change() в месте где загружается область делаем $('селектор динамичной области [name="delivery_date"]').change() Изменено 15 марта, 2017 пользователем yr4ik Цитата Ссылка на сообщение Поделиться на другие сайты
bananovsv Опубликовано 15 марта, 2017 Автор Жалоба Поделиться Опубликовано 15 марта, 2017 Yr4ik, примерно понял. А как здесь сделать дополнительно проверку на время? if(date_index == 0) Например, если выбран первый вариант и время меньше 18:00? Цитата Ссылка на сообщение Поделиться на другие сайты
yr4ik Опубликовано 15 марта, 2017 Жалоба Поделиться Опубликовано 15 марта, 2017 конкретика замысла мне не совсем понятна да и кода маловато. Но думаю так: $('[name="delivery_date"]').change(function(){ var today = new Date().getHours(); $('[name="delivery_time"] option:first').prop('disabled', ($(this).find(':selected').is(':first') || (today >= 7 && today <= 19))); }).change(); если в delivery_date выбрана 1я опция ИЛИ сейчас >=7:00 И <= 19:00 = то отключить 1ю опцию в delivery_time Цитата Ссылка на сообщение Поделиться на другие сайты
bananovsv Опубликовано 15 марта, 2017 Автор Жалоба Поделиться Опубликовано 15 марта, 2017 Спасибо, Yr4ik, всё получилось. Цитата Ссылка на сообщение Поделиться на другие сайты
TruApt Опубликовано 22 марта, 2017 Жалоба Поделиться Опубликовано 22 марта, 2017 <select name="delivery_date"> {for $i = 0 to 30} <option value="">{"+{$i} day"|date_format:'%d %m %y'}</option> {/for} </select> Интересует один момент, подскажите пожалуйста.Как вывести формат даты не "22 03 17", а "сегодня", "завтра" и после уже "24 03 17" Цитата Ссылка на сообщение Поделиться на другие сайты
chocolate_moles Опубликовано 22 марта, 2017 Жалоба Поделиться Опубликовано 22 марта, 2017 Интересует один момент, подскажите пожалуйста.Как вывести формат даты не "22 03 17", а "сегодня", "завтра" и после уже "24 03 17" <select name="delivery_date"> {for $i = 0 to 30} {if $i == 0} <option value="">Сегодня</option> {elseif $i == 1} <option value="">Завтра</option> {else} <option value="">{"+{$i} day"|date_format:'%d %m %y'}</option> {/if} {/for} </select> Цитата Ссылка на сообщение Поделиться на другие сайты
ahmed Опубликовано 23 марта, 2017 Жалоба Поделиться Опубликовано 23 марта, 2017 Чуть попроще: <select name="delivery_date"> <option value="">Сегодня</option> <option value="">Завтра</option> {for $i = 2 to 30} <option value="">{"+{$i} day"|date_format:'%d %m %y'}</option> {/for} </select> Цитата Ссылка на сообщение Поделиться на другие сайты
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.