множественный выбор с первым выбранным элементом

Question

Я создал множественный выбор для множественного выбора идентификатора. Я хочу выбрать первый выбранный элемент.

    <select id="multiselect" multiple="multiple" name="project_list" class="jqmsLoaded ms-list-1" style="display: none;">
<option value="Blue QA">Blue QA</option>
<option value="Easybridge">Easybridge</option>
<option value="K12RS">K12RS</option><option value="LEM">LEM</option>

</select>

 $('#multiselect').multiselect({
        search:true,
        selectAll: true,
        //select : [0], //
        texts: {
          search: 'Search Projects',
           placeholder: 'Select Projects',
      },
      });

Я хочу выбрать синий QA, выбранный при загрузке. Опции загружаются динамически.

пытались добавить как $('#multiselect select option:first-child').prop("selected", true);, но не повезло

Answer 1

Попробуйте следующий код

$(document).ready(function() {
 $('#multiselect select option:first-child').prop("selected", true);
 $('#multiselect').multiselect('refresh');
});

Answer 2

Jus добавляет этот скрипт при загрузке, как показано ниже: -

$(function(){

$('#multiselect').multiselect('select', $("#multiselect option:first").val()); 

//second approach 

$("#multiselect").val($("#multiselect option:first").val());
$('#multiselect').multiselect('rebuild');    //important to rebuild if any changes done using script



})

Пример

Answer 3

$( document ).ready(function() {
   $("#multiselect").prop("selectedIndex", 0);
});

Это должно работать, так как это устанавливает выбранный индекс. В функции prop() первый параметр передается для выбора индекса, а второй параметр, который теперь установлен на 0, указывает, какой <option> вы хотите выбрать. Таким образом, вы можете передать туда любой существующий индексный номер.

Answer 4

Вам нужно вызвать множественный выбор, вы можете выбрать опцию множественного выбора, снова вызвав его.

$('#multiselect').multiselect({
        search:true,
        selectAll: true,
        texts: {
          search: 'Search Projects',
           placeholder: 'Select Projects',
        },
      });
      
      var select_1 =  $('#multiselect option:eq(0)').val();
      //selecting element of multiiselect
      $('#multiselect').multiselect('select', select_1);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/js/bootstrap-multiselect.min.js" integrity="sha256-qoj3D1oB1r2TAdqKTYuWObh01rIVC1Gmw9vWp1+q5xw=" crossorigin="anonymous"></script>

<select id="multiselect" multiple="multiple multiselect" name="project_list" class="jqmsLoaded ms-list-1" style="display: none;">
<option  value="Blue QA">Blue QA</option>
<option value="Easybridge">Easybridge</option>
<option value="K12RS">K12RS</option><option value="LEM">LEM</option>

</select>