Как скрыть один value при выборе другого value?

Question

[amazinginternetsites]

Ребят, всеми правдами и неправдами выстрадал вот такую зависимость списков
Живой пример на jsfiddle

Но завис на таком деле, не могу реализовать чтобы в зависимости от выбранного value в одном списке, скрывались value в другом .

В списке "Есть ли у вас авто" при выборе "Есть" необходимо чтобы в списке "Авто" исчезли

<option value="9">Купить на легковую</option>
<option value="10">Купить на бус</option>
<option value="11">Купить на джип</option>
<option value="12">Купить на мото</option>

А при выборе "Нет" -

<option value="3">окрасить</option>
<option value="4">Перебрать/отремонтировать</option>
<option value="5">Поменять на легковую</option>
<option value="6">Поменять на бус</option>
<option value="7">Поменять на мото</option>
<option value="8">Поменять на джип</option>

Answer 1

[amazinginternetsites]

Решение найдено. Всем спасибо.

$(function() {
        var $first = $('#lr1ro'),$last = $('#lr1rowtd'),
         hide = {2 : $('option', $last).slice(2,8), 3 : $('option',$last).slice(8,12)},
         $targetList = $('#f_lr1rowtd');
 
         var update = function() {
             showFirst = [2, 3].indexOf(+this.value) >= 0;
             $targetList.toggle(showFirst)
             hide[2].add(hide[3]).remove();
             showFirst && hide[this.value].appendTo($last);
             $last.val(1).change();
 
         };
         var update2 = function() {
             var val = +this.value;
             var showFirst = [3, 4, 5, 6, 7, 8].indexOf(val) >= 0;
             var showSecond = [9, 10, 11, 12].indexOf(val) >= 0;
             $('#f_lr1rooq').toggle(showFirst);
             $('#f_lr1ronq').toggle(showSecond);
         };
         $first.change(update).change();
         $last.change(update2).change();
     });

Answer 2

[Алексей Николаев]

Согласен с Алексей Уколов. Плюс есть куча готовых решений.

Однако, в рамках вашего кода (да и в рамках практики написания велосипедов) я реализовал бы, например, подобный механизм.

Comments

[amazinginternetsites]

Хороший велосипед, но знаете в чем трабл, в том что, при изменении родительского value дочерние исчезают - гуд. но при этом
1. в дочернем списке так и остается выбранное значение.
2. при прокрутке списка все равно выбираются те, что скрыты.

[amazinginternetsites]

1. в дочернем списке так и остается выбранное значение.
2. Если раскрыть список и прокрутить с помощью стрелок вверх-вниз те пункты что скрыты равно выбираются.

Answer 3

[lega]

Вот пример на Angular Light, работает без JS и jQuery.
Если нужна более сложная логика то добавьте JS :)
Не стал делать "очистку" параметров, т.к. для этого уже лучше js (контроллер) применить, хотя можно сюда же в шаблон запихать.

// Поправил пример, добавил очистку значений

Comments

[lega]

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

[amazinginternetsites]

Замечательное решение.
Но нет возможности править php файл, который отвечает за вид выводимых списков. (
Засада.
Поэтому с упорством дауна пытаюсь найти решение с помощью js.
Html код со списками и полями генерируется CMS' кой в том виде который я показывал в примере.