Отфильтровать дочернее значение поля выбора от родителя с помощью Jquery

У меня есть два поля выбора, одно содержит названия стран, а другое содержит все названия штатов всех стран.

<select id="parent">
 <option value="Country1">Country1</option>
 <option value="Country2">Country2</option>
 <option value="Country3">Country3</option>
</select>

<select id="child">
 <option value="Country1 state1">Country1 state1</option>
 <option value="Country1 state2">Country1 state2</option>
 <option value="Country2 state1">Country2 state1</option>
 <option value="Country2 state2">Country2 state2</option>
 <option value="Country3 state1">Country3 state1</option>
</select>

Затем, если я выберу страну 1 из родительского поля выбора, в поле выбора состояния необходимо показать только все состояния страны 1 и удалить из него все остальные состояния.

Мне нужно найти дочерние значения по частичному совпадению и проверить родительское значение.

$(document).ready(function(){
 $('#parent').change(function(){
  var filter = $(this).val();
  $('option').each(function(){
   if ($('option:contains("' + var1 '")') == filter) {     
    $(this).show();
   } else {
    $(this).hide();
   }
  var var1= $('#child').val(filter);
  })
 })
})

Пожалуйста помоги мне с этим.


jquery
person user811589    schedule 01.07.2011    source источник
comment
Проверьте источник подключаемого модуля jQuery Chained Selects. Он делает что-то очень похожее, используя имена классов. Вы должны быть в состоянии адаптироваться оттуда. appelsiini.net/projects/chained   -  person Mika Tuupola    schedule 29.09.2012

Ответы (2)


arrow_upward
0
arrow_downward 

$("#parent").change(function(){
    var filter = $(this).val();
    $("#a").append('a');
    $('select#child option').each(function(){
       $("#a").append('a');
       if ( $(this).val().substring(0,8) == filter) {     
          $(this).show();
       } 
       else {
           $(this).hide();
       }
    });

   var var1= $('#child').val(filter);
})

http://jsfiddle.net/yZm7A/3/

хотя, как видно, проблема с выбранным значением во втором раскрывающемся списке остается неизменной

person Ēriks Daliba    schedule 01.07.2011
comment
помните, что $(this).val() никогда не бывает ==filter, а начинается с filter. Поэтому следует проверить, $(this).val().substring(0, 8) == filter - person ub1k; 01.07.2011

arrow_upward
0
arrow_downward

Попробуйте IE

else {
   $(this).hide();
}

изменить его на

else {
   $(this).remove();
}
person Stanley    schedule 29.09.2012