Объединение нескольких вариантов поля выбора в один выбор - PullRequest
Новая
       345

Объединение нескольких вариантов поля выбора в один выбор

0 голосов
/ 02 декабря 2011

Я использую модифицированную версию плагина jquery jquery.chained.js, чтобы отфильтровать опции и флажки выбора на основе другого значения поля выбора.Однако теперь мне нужно отфильтровать поле выбора на основе того, какие варианты 2 из предыдущих блоков выбора.

У меня есть 3 поля выбора.

  1. Персонал
  2. Комнаты
  3. Услуги

и несколько флажков ИЛИ выберите поля для

  • Аддоны

Вышеуказанные аддоны зависят отпредпочтение будет отображаться либо в виде флажков, либо в раскрывающихся списках

. Если вы измените Staff, то все равно, как сейчас, параметры Services и Addons изменятся на те службы, к которым у персонала есть доступ.Однако теперь мне нужно сделать так, чтобы Services и Addons устанавливались исходя из того, что Staff имеет доступ к этим Services и что Rooms Предлагает эти услуги.

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

Подводя итог, я ищу добавление поддержки для поля выбора номеров для дальнейшей фильтрации внизопции Services и AddonServices.

Пример кода можно найти http://bit.ly/uzEDL2

РЕДАКТИРОВАТЬ: checkboxradio () для jquery Mobile, так что не беспокойтесь о них.

1 Ответ

1 голос
/ 02 декабря 2011

Чтобы сделать выбор ребенка зависимым от значений двух родителей, используйте имя класса, например first\second. Обратите внимание, что если у вас действительно сложная структура выбора, поддержание такого рода классов станет громоздким. В этом случае может быть проще использовать удаленную версию плагина.

Пример взят из документации плагина . В этом примере дизельный двигатель доступен только для седанов BMW 3 и 5 серии. Это достигается использованием имен классов series-3\sedan и series-5\sedan. 

<select id="series">
  <option value="">--</option>
  <option value="series-3" class="bmw">3 series</option>
  <option value="series-5" class="bmw">5 series</option>
  <option value="series-6" class="bmw">6 series</option>
  <option value="a3" class="audi">A3</option>
  <option value="a4" class="audi">A4</option>
  <option value="a5" class="audi">A5</option>
</select>

<select id="model">
  <option value="">--</option>   
  <option value="coupe" class="series-3 series-6 a5">Coupe</option>
  <option value="cabrio" class="series-3 series-6 a3 a5">Cabrio</option>
  <option value="sedan" class="series-3 series-5 a3 a4">Sedan</option>
  <option value="sportback" class="a3 a5">Sportback</option>
</select>

<select id="engine">
  <option value="">--</option>   
  <option value="25-petrol" class="series-3 a3 a4">2.5 petrol</option>
  <option value="30-petrol" class="series-3 series-5 series-6 a3 a4 a5">3.0 petrol</option>
  <option value="30-diesel" class="series-3\sedan series-5\sedan a5">3.0 diesel</option>
</select>

$("#model").chained("#series");
$("#engine").chained("#series, #model");

Обратите внимание, что ваш HTML-код недействителен. Одно число не является допустимым именем класса. Имя класса должно начинаться с буквы подчеркивания [a–z], подчеркивания [_] или тире [-], за которым следуют цифры, буквы, подчеркивания и тире. Лучшее объяснение можно найти из: Допустимые символы для идентификаторов CSS .

...