Обновить раскрывающийся список на основе опции выбора в списке

Мне очень нужна помощь. Я новичок в jQuery, и я пытаюсь обновить dropdown list или изменить его значение при выборе опции из списка.Обновить раскрывающийся список на основе опции выбора в списке

HTML

<select name="State_locate" class="State"> 
    <option value=" " selected="selected">Select a state</option> 
    <option value="AL">Alabama</option> 
    <option value="AK">Alaska</option> 
</select> 
<div id="City_1" class="Alabama"> 
    <select name="City_location[]" class="CityExt"> 
     <option value="Null" selected="selected">Select a city</option> 
     <option value="Avondale">Avondale</option> 
     <option value="Buckeye">Buckeye</option> 
     <option value="Catalina">Catalina</option> 
    </select> 
</div> 
<div id="City_1" class="Alaska"> 
    <select name="City_location[]" class="CityExt"> 
     <option value="Null" selected="selected">Select a city</option> 
     <option value="Lancaster">Lancaster</option> 
     <option value="Soth">Soth</option> 
     <option value="Foothills">Foothills</option> 
    </select> 
</div>

// JavaScript Document 

$("select").bind("change", function() { 

    if ($(this).val() == "AL") { 
     $(".Alabama").slideDown(); 

     $(".Alaska").slideUp(function() { 

      if ($('.Alabama').is(':visible')) { 
       $(".Alaska option[value='Lancaster']").attr('selected', 'selected') 
      } 
     }); 
    } else if ($(this).val() == "AK") { 
     $(".Alaska").slideDown(); 
     $(".Alabama").slideUp(); 
    } 
})

, что я пытаюсь сделать, когда выбрано состояние, то город падает вниз. Это работает отлично. Но после отправки значения города хранятся в массиве City_location[].

Проблема заключается в том, что если пользователь выбирает город для Аляски, а затем выбирает другой город под Алабамой перед отправкой формы, вы оказываетесь в двух городах под Алабамой и Аляской в массиве.

Я ищу способ выбрать значение «Нуль» для штата Аляска, если выбран Алабама. Но код, который у меня есть, не работает. Он работает только в том случае, если значение имеет значение «Null». Например, если я использую значение «Ланкастер», в этом разделе jQuery кода

$(".Alaska option[value='Lancaster']").attr('selected', 'selected')

Это только работает один раз. Если я делаю это дважды, он не обновляется. Как я могу решить эту проблему.

Извините за длинный код. Спасибо за помощь.

источник

2013-10-20 Adagoon

Зачем вам хранить его в массиве? Вы выбираете несколько значений? –

Я хранил его в массиве, потому что, если я не делаю этого так, когда я отправляю свою форму, я не могу получить город, потому что выбор имеет то же имя. Это всего лишь пример кода, я пытаюсь сделать это для всех 50 состояний. Если бы у меня были имена с разными именами, тогда мой код будет длиннее. – Adagoon

Вы могли бы сделать что-то вроде этого:

$('.state').on('change',function() { 
    $('.CityExt').val(''); 
}

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

источник

2013-10-20 04:59:10 NicholasJohn16

Я попробовал ваше предложение, но не имел никакого успеха. Я использовал вашу идею, а также одну из них, чтобы придумать этот код. if ($ (this) .val() == "AL") { $ (". Алабама").скользить вниз(); \t \t \t $ (»Alaska. ") SlideUp (функция() { , если ($ (" Алабама:. Виден "..) Длина) { $ (" вариант на Аляске [значение = 'Anchoragege'] ") .attr ('selected', 'selected'); \t} }); – Adagoon

Попробуйте вместо этого:

$(".Alaska option:eq(0)").attr('selected', 'selected')

Поскольку нулевой элемент является первым это будет решить вашу озабоченность.

источник

2013-10-20 05:04:12

Спасибо за быстрый ответ. Я попробовал ваше предложение, и ничего не случилось. – Adagoon

Я думаю, что вышеупомянутое решение - это то, что вы ищете. Он выбирает значение 'null' для класса' .alaska' при выборе '.Alabama'. –

Я обнаружил свою проблему. Вместо того, чтобы использовать «подпирать» я использовал «Attr»

$(".Alaska option[value='Lancaster']").prop('selected', 'selected');

Теперь каждый раз, когда выбран другой город перед отправкой более чем в два раза, код не работает только один раз.

Я искал значения, но до сих пор не понимаю, почему использовать «prop» вместо «attr» в jquery. Я продолжу поиск. Я ценю всю помощь, которую я получил от всех людей, которые отреагировали на меня.

источник

2013-10-20 19:34:58 Adagoon

Это потому, что вы используете jquery 1.6+, и здесь представлен проспект. Посмотрите на него более подробно на http://api.jquery.com/prop/ –

Обновить раскрывающийся список на основе опции выбора в списке

ответ

Смежные вопросы