Как выбрать параметры в списке множественного выбора с помощью jQuery?

Question

У меня есть два выпадающих списка. Когда пользователь выбирает значение из первого, которое я хочу во втором (которое имеет опцию множественного выбора), с помощью jQuery, чтобы автоматически выбирать некоторые значения. Как я могу это сделать?

First select box:
<select id="update_carte_s" name="update_carte_s">
     <option value="5!**8,9**!6!44.9">Ghid complet Internet</option>
     <option value="6!**6,7**!6!24.95">PC pas cu pas</option>
     <option value="7!**10**!3!27.95">Jocul ingerului</option>
     <option value="8!**11,12**!8!39">Ghidul vinurilor</option>
</select>
Second select box:
<select id="uc_autori_s" name="uc_autorilist[]" size="5" multiple>
     <option value="3">Rose Tremain</option>
     <option value="4">Jonathan Coe</option>           
     <option value="5">Cecilia Ahern</option>
     <option value="6">Marinel Serban</option>
     <option value="7">Emanuela Cherchez</option>
     <option value="8">Peter Buckley</option>
     <option value="9">Clark Duncan</option>
     <option value="10">Carlos-Ruiz Zafon</option>
     <option value="11">Catalin Paduraru</option>
     <option value="12">Dan-Silviu Boerescu</option>
</select>

Значения, выделенные полужирным шрифтом в первом окне выбора, разделенные на ,, представляют собой значения, которые я хочу выбрать во втором окне выбора. Например, 11,12 будет означать, что во втором окне будут выбраны значения со значениями 11 и 12.

В настоящее время у меня есть что-то вроде этого:

$.bookAuthors = $.bookDetailsArray[1].split(',');
$.each($.bookAuthors, function( intIndex, objValue ){
      $("#uc_autori_s").val(objValue).attr("selected","selected");
});

но проблема в том, что в моем случае 12 выбрано только последнее значение (выбор 11 потерян).

Answer 1

Вы можете передать выборку с несколькими значениями в массив

$("#uc_autori_s").val( $.bookAuthors );

Answer 2

Вы не сможете использовать метод val для установки нескольких option s в качестве выбранного. Вместо этого вам следует выбрать саму опцию и установить ее выбранный атрибут:

$('#uc_autori_s option[value=' + objValue + ']').attr('selected', true);

Answer 3

Например, у вас есть поле выбора, подобное этому:

<select id="books">
  <option value="1">Harry Porter</option>
  <option value="2">Eragon</option>
  <option value="3">Gadfly</option>
  <option value="4">C++ For Dummies</option>
  <option value="5">Android Cookbook</option>
</select>

Способ выбора нескольких параметров (например, Eragon, Gadfly) заключается в создании объекта, который содержит значения параметров, которые вы хотите выбрать, а затем используйте это:

var options = ["2", "3"];
$("#books").val(options);

Answer 4

Вот простой способ найти и выбрать раскрывающийся список с множественным выбором

 $('#selectID ').children("option[value=" + myValue + "]").prop("selected", true);

Answer 5

<select id="multiple" multiple="multiple">
  <option selected="selected">Multiple</option>
  <option>Multiple2</option>
  <option selected="selected">Multiple3</option>
</select>

<script>
$("#multiple").val(["Multiple2", "Multiple3"]);
</script>

Answer 6

Самый простой и обновленный способ использования jQuery - использовать функцию карты

    var abc = $("select option:selected").map(function() {
                    return this.value;
                }).get().join(",");

Answer 7

Вам необходимо выполнить следующие действия, чтобы выбрать значения в множественном выборе. Так как multiselect возвращает массив значений при выборе, то же самое нужно дать ему, когда его значения должны быть установлены по умолчанию.

<select id="sonyConsoles" multiple>
<option value="1">PS4 Pro</option>
<option value="2">PS4</option>
<option value="3">PS3</option>
<option value="4">PS Vita</option>
<option value="5">PSP</option>
</select>

Если вы хотите, чтобы опции 1,2 и 4 были выбраны по умолчанию, тогда сделайте; $ ( '#') SonyConsoles вал ([1,2,4]);.

Это вернет selectBox, в котором выбраны опции 1,2 и 5.

Answer 8

Вы должны удалить текущие параметры, чтобы манипулировать выбранными параметрами.

Вот пример того, как добавить параметры:

<select id="mySelectId">
  <option value=""></option>
  <option value="Argentina">Argentina</option>
  <option value="Germany">Germany</option>
  <option value="Greece">Greece</option>
  <option value="Japan">Japan</option>
  <option value="Thailand">Thailand</option>
</select>

<script>
  mySelect = $('#mySelectId');
  var selected = mySelect.val();                         //get current values
  selected = selected.concat(['Germany','Argentina']);   //merge with new values
  selected = Array.from(new Set(selected));              //make values unique
  mySelect.val(null);                                    //delete current options
  mySelect.val(selected);                                //add new options
</script>

Для выбранных .js добавить:

<script>
  mySelect.trigger('chosen:updated');
</script>