Как справиться с онкликом даже при загрузке мультиселекта?

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

            <select id="selectoption" multiple="multiple">
              <option value="opt1">All</option>
              <option value="opt2">all_content1</option>
              <option value="opt2">all_content1</option>
              <option value="opt3">all_content1</option>
              <option value="opt4">all_content1</option>
              <option value="opt5">all_content1</option>
              <option value="opt6">all_content1</option>
              <option value="opt7">all_content1</option>
              <option value="opt8">all_content1</option>
              <option value="opt9">separate_content1</option>
              <option value="opt10">separate_content2</option>
            </select>

Я добавил мультиселект, как это,

$("#selectoption").multiselect();

В bootstrap multiselect у них есть своя опция select all, которую я не хочу использовать здесь. Я хочу логику "выбора всего", которая переключает выбор до "opt8". Пожалуйста помоги.

Источник

2 ответа

Решение

Вы можете выбрать всю логику, если вы хотите выбрать все, что у вас есть, например:

  $('#selectoption option').attr('selected', true);

Но, как вы и просили, ваш код будет таким, как нажмите ВСЕ:

$('option').click(function(){  
    if($(this).val()=="opt1")      
        $("#selectoption").val(["opt2","opt3","opt4","opt5","opt6","opt7","opt8","opt9"]);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<select id="selectoption" multiple="multiple">
              <option value="opt1">All</option>
              <option value="opt2">all_content1</option>
              <option value="opt3">all_content1</option>
              <option value="opt4">all_content1</option>
              <option value="opt5">all_content1</option>
              <option value="opt6">all_content1</option>
              <option value="opt7">all_content1</option>
              <option value="opt8">all_content1</option>
              <option value="opt9">all_content1</option>
              <option value="opt10">separate_content1</option>
              <option value="opt10">separate_content2</option>
            </select>

Источник

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

Или просто добавьте класс "selectall" ко всем опциям или оптгруппам, которые должны обрабатываться select_all функция.

<select id="selectoption" multiple="multiple">
          <option value="opt1">All</option>
          <optgroup class="selectall" label="Group 1">
              <option value="opt2">all_content1</option>
              <option value="opt2">all_content1</option>
              <option value="opt3">all_content1</option>
              <option value="opt4">all_content1</option>
              <option value="opt5">all_content1</option>
              <option value="opt6">all_content1</option>
              <option value="opt7">all_content1</option>
              <option value="opt8">all_content1</option>
          </optgroup>
          <optgroup label="Group 2">
              <option value="opt9">separate_content1</option>
              <option value="opt10">separate_content2</option>
          </optgroup>
          <optgroup class="selectall" label="Group 3">
              <option value="opt9">separate_content1</option>
              <option value="opt10">separate_content2</option>
          </optgroup>
        </select>

С уважением

Источник
Другие вопросы по тегам