it-roy-ru.com

Как установить "выбранную опцию" из выпадающего списка выбора с помощью jquery

У меня есть следующая функция jquery:

$.post('GetSalesRepfromCustomer', {
    data: selectedObj.value
}, function (result) {
    alert(result[0]);
    $('select[name^="salesrep"]').val(result[0]);
});

result[0] - это значение, которое я хочу установить в качестве элемента selected в моем поле выбора .result[0] равно Bruce jones.

поле выбора заполняется запросом к базе данных, но один из представленных html:

<select id="salesrep" data-theme="a" data-mini="true" name="salesrep">
<option value=""> </option>
<option value="john smith">john smith</option>
<option value="Bruce Jones">Bruce Jones</option>
<option value="Adam Calitz">Adam Calitz</option>
<option>108</option>
</select>

$('select[name^="salesrep"]').val(result[0]); не заполняет выбранную опцию окна выбора. Я также попытался $("#salesrep").val(result[0]); без удачи.

Любая помощь приветствуется.

так что я хочу, чтобы выбранный/выделенный вариант в выпадающем списке salesrep был Брюс Джонс.

HTML будет:

<select id="salesrep" data-theme="a" data-mini="true" name="salesrep">
<option value=""> </option>
<option value="john smith">john smith</option>
<option value="Bruce Jones" selected >Bruce Jones</option>
<option value="Adam Calitz">Adam Calitz</option>
<option>108</option>
</select>

Еще раз спасибо,

Весь скрипт

<script type="text/javascript"> 
    $(document).ready(function () {

           $("#customer").autocomplete( 
     { 
     source: "get_customers", 
     messages: 
     { 
     noResults: '', 
     results: function() {} 
     }, 
     select: function( event, ui ) 
     { 
      var selectedObj = ui.item;        

     $.post('GetSalesRepfromCustomer', {data:selectedObj.value},function(result) { 
      alert(result[0]);
       var selnametest="Bruce Koller";
    $("#salesrep").val(selnametest);
     }); 

     } 
     });
         });


</script>

Рендеринг HTML это:

<select id="salesrep" data-theme="a" data-mini="true" name="salesrep">
<option value=""> </option>
<option value="RyanLubuschagne">Ryan Lubuschagne</option>
<option value="Bruce Jones">Bruce Jones</option>
<option value="Adam Calitz">Adam Calitz</option>
</select>
27
Smudger

Попробуй это :

$('select[name^="salesrep"] option[value="Bruce Jones"]').attr("selected","selected");

Просто замените option[value="Bruce Jones"] на option[value=result[0]]

И прежде чем выбрать новую опцию, вы можете отменить выбор предыдущей: 

$('select[name^="salesrep"] option:selected').attr("selected",null);

Вы также можете прочитать это: jQuery получает текст тега конкретной опции

Edit: Используя jQuery Mobile, эта ссылка может обеспечить хорошее решение: jquery mobile - установить значения select/option

46
Jb Drucker

Установите значение, которое будет установлено в качестве выбранной опции для выпадающего меню:

$("#salesrep").val("Bruce Jones");

Здесь работает Демо

Если это все еще не работает:

  1. Пожалуйста, проверьте ошибки JavaScript на консоли.
  2. Убедитесь, что вы включили файлы jquery
  3. ваша сеть не блокирует файл jquery при внешнем использовании.
  4. Проверьте ваш источник просмотра точную копию элемента stop jquery для правильной работы
27
Zaheer Ahmed

Я не думаю, что кто-то упомянул одну вещь - глупую ошибку, которую я допустил в прошлом (особенно при динамическом заполнении выборок). .val () jQuery не будет работать для выбора ввода, если нет опции со значением, совпадающим с предоставленным значением.

Вот объяснение скрипки -> http://jsfiddle.net/go164zmt/

<select id="example">
    <option value="0">Test0</option>
    <option value="1">Test1</option>
</select>

$("#example").val("0");
alert($("#example").val());
$("#example").val("1");
alert($("#example").val());

//doesn't exist
$("#example").val("2");
//and thus returns null
alert($("#example").val());
3
Jake Zieve

Вы должны заменить YourID и value = "3" для своих текущих.

$(document).ready(function() {
  $('#YourID option[value="3"]').attr("selected", "selected");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<select id="YourID">
  <option value="1">A</option>
  <option value="2">B</option>
  <option value="3">C</option>
  <option value="4">D</option>
</select>

и значение = "3" для ваших текущих.

$('#YourID option[value="3"]').attr("selected", "selected");

<select id="YourID" >
<option value="1">A </option>
<option value="2">B</option>
<option value="3">C</option>
<option value="4">D</option>
</select>
2
Oscar Fuquen

$(document).ready(function() {
  $('#YourID option[value="3"]').attr("selected", "selected");
  $('#YourID option:selected').attr("selected",null);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<select id="YourID">
  <option value="1">A</option>
  <option value="2">B</option>
  <option value="3">C</option>
  <option value="4">D</option>
</select>

1
Madhuka Dilhan

Соответствие между .val('Bruce jones') и value="Bruce Jones" чувствительно к регистру. Похоже, вы используете заглавную букву Джонс в одном, а не в другом. Либо отследите, откуда возникла разница, используйте идентификаторы вместо имени, либо вызовите .toLowerCase() для обоих.

0
Black Mantha