Скрыть элементы select

Тема в разделе "JavaScript", создана пользователем Горбушка, 29 янв 2014.

Статус темы:
Закрыта.
Модераторы: ZiX
  1. Горбушка

    Горбушка Ищу её...

    Регистр.:
    2 май 2008
    Сообщения:
    3.115
    Симпатии:
    2.130
    Собственно, необходимо по выбору одного из параметров в первом select сделать неактивными варианты во втором (третьем и десятом) элементы, id (value/class) который меньше некого значения...

    Т.е. значения у нас: 5, 10, 15 - нужно оставить только те, которые больше 10. Значения могу копировать в ID или class, не проблема...

    Статично - не получится, ибо число постоянно меняется...Значения в списках статичны.
     
  2. jDony

    jDony Создатель

    Регистр.:
    25 янв 2014
    Сообщения:
    41
    Симпатии:
    40
    Точно подсказать не могу, но могу посоветовать где покопаться.
    Есть такая замечательная либа - как underscore.js. Там есть метод "_.filter", который как раз занимается фильтрацией массивов.
    Я ее использовал только в связке с AngularJS, но отдельно она будет работать точно так же.

    В AngularJS для подобных целей так же используется фильтр, можешь подсмотреть реализацию у них.
    http://docs.angularjs.org/api/ng.filter:filter

    PS
    Вообще мне видится это так:
    - На нужный select вешается событие change.
    - С помощью _.filter фильтруем второй массив и генерим второй\третий\десятый select
     
    Последнее редактирование: 29 янв 2014
    Горбушка нравится это.
  3. Горбушка

    Горбушка Ищу её...

    Регистр.:
    2 май 2008
    Сообщения:
    3.115
    Симпатии:
    2.130
    Не. не, не... Слишком громоздко для такой задачи...

    Уверен, что обычный jQuery без сторонних плагинов всё сделает на ура... По сути, в зависимости от выбранного пункта нужно генерировать второй и третий селекты... При этом вариантов всего 2 - либо полный, либо обрезанный... Обрезку могу делать на php заранее и выводить не 3, а 5 селектов и показывать при 1 значении первого - 2 и 3, а при других значениях первого - 4 и 5...
     
  4. jDony

    jDony Создатель

    Регистр.:
    25 янв 2014
    Сообщения:
    41
    Симпатии:
    40
    Вот как-то так.
    underscorejs весит 5кб. Не думаю что это слишком уж громоздко.

    Вот версия с 3 селектами
     
    Последнее редактирование: 29 янв 2014
    Горбушка нравится это.
  5. Горбушка

    Горбушка Ищу её...

    Регистр.:
    2 май 2008
    Сообщения:
    3.115
    Симпатии:
    2.130
    Эм, Не совсем то... Уже понял, что поставил не правильную задачу...

    В общем, описываю детально и на этот раз правильно =)

    Первый список: Сегодня, завтра, послезавтра...
    Второй список - 0-23 (часы)
    Третий список - 0-59 (минуты)

    Так вот, если выбрано "Сегодня", то надо оставить в списке для выбора время, которое ещё не наступило. Так, если сейчас 12:36, то выбор будет 12-23, а минуты для 12 - 37-59, для 13 и более - 0-59.

    Вот! Вот теперь ТЗ верное =)

    Кроме того, надо работать с интервалами... К примеру, с "9 до 12" - если сейчас 8:30 - он доступен, если 9+ - он не доступен....

    Как-то так.

    P.s. уже сам понял, что одним jQuery обойтись будет тяжело...
     
  6. jDony

    jDony Создатель

    Регистр.:
    25 янв 2014
    Сообщения:
    41
    Симпатии:
    40
    Так?
    Проверка на интервал так же добавляется довольно легко.
    Код не для продакшена, просто как пример.
     
  7. Горбушка

    Горбушка Ищу её...

    Регистр.:
    2 май 2008
    Сообщения:
    3.115
    Симпатии:
    2.130
    Эм, что мешает его в продакшен? Вроде ж нормально написан. Ну за исключением стандартного добавления id, class, стилей и т.д.

    С интервалами - попробуемс =) Но пока в себя не особо верю =)))
     
  8. jDony

    jDony Создатель

    Регистр.:
    25 янв 2014
    Сообщения:
    41
    Симпатии:
    40
    Ну я бы все if заменил на какой-нибудь validationService, который будет возвращать нужные данные для фильтрации. Что-то вроде:
    Код:
    var validationService = {
        getValidator: function (option) {
            switch (option)
            {
                case 'today':
                    var d = new Date();
                    return {'hour': d.getHour(), 'minute': d.getMinute()};
                    break;
                case 'tomorrow':
                    return {};
                // ...
            }
        }
    };
    И затем в _.filter использовал бы результат. Да еще много чего можно улучшить :) Писал просто чтоб показать основной вектор куда следует думать.
    Про интервалы я не совсем понял, так что по ним ничего сказать не могу.
     
    Горбушка нравится это.
  9. Горбушка

    Горбушка Ищу её...

    Регистр.:
    2 май 2008
    Сообщения:
    3.115
    Симпатии:
    2.130
    С интервалами то всё как-раз просто... Смотри:
    Имеем, к примеру, интервал 3 часа... Т.е. генерируются варианты в список (генерируются PHP, JS получит уже готовый список в нужном виде, но юзер должен видеть именно "С 9 до 12" к примеру) с 0 до 3, с 3 до 6 и т.д. Соответственно, сравниваем с начальным часом и проверяем:
    С 3 до 6 - доступен если сейчас меньше 3 часов
    С 6 до 9 - доступен, если сейчас меньше 6 часов
    И т.д.

    Ну а про улучшения и прочее - думаю, сейчас это не актуально - мне надо максимально просто и чтобы после меня это мог любой поправить =) Я дико сомневаюсь, что getValidator начинающие кодеры знают. Впрочем, и я его не знаю =)))

    P.s. если сделаешь интервалы - кидай сразу кошелёк WM/ЯД - вечером кину на пиво. А то как-то уже и не удобно - ты за меня почти всю работу сделал.
     
  10. jDony

    jDony Создатель

    Регистр.:
    25 янв 2014
    Сообщения:
    41
    Симпатии:
    40
    http://jsfiddle.net/v6R3J/2/ вот набросал.

    Если я правильно понял задачу, то все должно работать как надо.
    Поиграйся со строчкой var hour = 5; , чтобы проверить как оно работает.

    PS
    Вообще время получать на клиенте не есть гуд. Лучше аяксом время с сервера утянуть.

    PPS
    http://jsfiddle.net/v6R3J/3/ вот добавил сброс минут при выборе часа.

    Вообще код довольно грязный, много дублирования. Но думаю ты сам почистишь, и приведешь в порядок.
     
    Последнее редактирование: 29 янв 2014
    Горбушка нравится это.
Статус темы:
Закрыта.