Как я могу установить значение DropDownList с помощью jQuery?

Question

Как следует из вопроса, как мне установить значение элемента управления DropDownList с помощью jQuery?

Answer 1

$("#mydropdownlist").val("thevalue");

просто убедитесь, что значение в тегах параметров соответствует значению в методе val.

Answer 2

Если вы работаете с индексом, вы можете установить выбранный индекс напрямую с помощью .attr ():

$("#mydropdownlist").attr('selectedIndex', 0);

Это установит его на первое значение в выпадающем списке.

Edit: То, как я это делал выше, работало. Но похоже, что больше нет.

Но, как Хан так приятно отмечает в комментариях, правильный способ сделать это:

$("#mydropdownlist").get(0).selectedIndex = index_here;

Answer 3

Как подсказывает @Nick Berardi, если ваше измененное значение не отражено на интерфейсе пользовательского интерфейса, попробуйте:

$("#mydropdownlist").val("thevalue").change();

Answer 4

Попробуйте этот очень простой подход:

/*make sure that value is included in the options value of the dropdownlist 
e.g. 
(<select><option value='CA'>California</option><option value='AK'>Alaska</option>      </select>)
*/

$('#mycontrolId').val(myvalue).attr("selected", "selected");

Answer 5

Если у вас выпадающий список Asp.Net, то приведенный ниже код будет работать нормально,

 $("#<%=DropDownName.ClientID%>")[0].selectedIndex=0;

Но если ваш DropDown - это HTML, то этот код будет работать.

 $("#DropDownName")[0].selectedIndex=0;

Answer 6

Лучший ответ на вопрос:

$("#comboboxid").val(yourvalue).trigger("chosen:updated");

например:

$("#CityID").val(20).trigger("chosen:updated");

или

$("#CityID").val("chicago").trigger("chosen:updated");

Answer 7

Есть много способов сделать это. вот некоторые из них:

$("._statusDDL").val('2');

OR

$('select').prop('selectedIndex', 3);

Answer 8

Попробуйте:

jQuery("#availability option:selected").val();

Или, чтобы получить текст опции, используйте text ():

jQuery("#availability option:selected").text();

Подробнее:

 http://api.jquery.com/val/
 http://api.jquery.com/text/

$(document).ready(function(){ 
  $('#button1').click(function(){ 
    alert($('#combo :selected').text());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="combo">
  <option value="1">Test 1</option>
  <option value="2">Test 2</option>
</select>
<input id="button1" type="button" value="Click!" />

Answer 9

установить значение и обновить событие выпадающего списка

$("#id").val("1234").change();

Answer 10

Использование выделенного / проверенного ответа выше сработало для меня ... вот немного понимания. Я немного изменил при получении URL, но в основном я определяю URL в Javascript, а затем задаю его с помощью ответа jquery сверху:

<select id="select" onChange="window.location.href=this.value">
    <option value="">Select a task </option>
    <option value="http://127.0.0.1:5000/choose_form/1">Task 1</option>
    <option value="http://127.0.0.1:5000/choose_form/2">Task 2</option>
    <option value="http://127.0.0.1:5000/choose_form/3">Task 3</option>
    <option value="http://127.0.0.1:5000/choose_form/4">Task 4</option>
    <option value="http://127.0.0.1:5000/choose_form/5">Task 5</option>
    <option value="http://127.0.0.1:5000/choose_form/6">Task 6</option>
    <option value="http://127.0.0.1:5000/choose_form/7">Task 7</option>
    <option value="http://127.0.0.1:5000/choose_form/8">Task 8</option>
</select>
<script>
    var pathArray = window.location.pathname.split( '/' );
    var selectedItem = "http://127.0.0.1:5000/" + pathArray[1] + "/" + pathArray[2];
    var trimmedItem = selectedItem.trim();
    $("#select").val(trimmedItem);
</script>