Как манипулировать выбранным состоянием мультиселекции на мобильных устройствах (Android) - PullRequest
0 голосов
/ 03 апреля 2019

Управление статусом выбора в мульти-выборе с помощью кнопок «выбрать все» и «выбрать нет». Ванильные кнопки JavaScript отлично работают на рабочем столе, но не на мобильных устройствах (проверено только на Android).

Я не нашеллюбое решение Vanilla JS в Интернете.Поскольку мое устройство Android отображает параметры в виде флажков, я попытался установить флажок check = 'true';на параметры [], отдельные элементы и как часть класса.Я также попытался заменить selected = 'false' на selected = 'true' с помощью innerHTML.

HTML:

<div class='form-group'>
<label for='columns'>Columns: </label><br>
  <button id='all_columns' class='btn btn-sm text-white'>all</button>
  <button id='clear_columns' class='btn btn-sm text-white'>none</button>
<select multiple id='columns' class='form-control'>
  <option value='0'>Timestamp</option>
  <option value='1'>Option1</option>
  <option value='2'>Option2</option>
  <option value='3' selected='true'>Option2</option>
  <option value='4' selected='true'>Option3</option>
</select>
</div>

JS для кнопки выбора всех

if (document.getElementById("all_columns")){
    function all_columns(){
        var elements = document.getElementById("columns").options;
        for(var i = 0; i < elements.length; i++){
         elements[i].selected = true;
        }
    }
    document.getElementById("all_columns").addEventListener('click', all_columns);
}

Я бы ожидал, что мобильная реализация, которая отображает все опции в виде флажков во всплывающем окне, все еще будет в состоянии манипулировать простым javascript - но пока мне не повезло.Единственное, что я обнаружил, чтобы поставить галочку в поле, это поставить «выбранный» в теге параметров (или selected = «true», как описано выше, когда я попытался заменить решение innerHTML.)

Благодарность заесть идеи;Я предпочитаю не перезагружать страницу, поскольку пользователь теряет свое место на странице, но в худшем случае учел бы это.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...