множественный выбор из выпадающего списка для веб-приложения? - PullRequest
0 голосов
/ 12 октября 2010

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

например, показывать мне все транзакции из состояний TX, WV и ID.

Причина, по которой я решил использовать запрошенный выпадающий список, а не список, состоит в том, что есть более 40 параметров, из которых они могут выбрать, и моя страница уже заполнена таким количеством элементов управления.Спасибо заранее.

Ответы [ 2 ]

1 голос
/ 13 октября 2010

Вы не сможете сделать это с помощью выпадающего списка напрямую, но вы можете подделать его.

У вас есть скрытый ListBox на вашей странице. Создайте что-то, что выглядит как выпадающий список визуально (метка + изображение будет работать). Во время события onclick вашего поддельного выпадающего списка покажите свой список под вашим выпадающим списком. Скрыть список во время события onblur для ListBox. Также вы можете добавить jquery для анимации открытия вашего списка, чтобы он более точно соответствовал выпадающему списку.

0 голосов
/ 13 октября 2010

попробуйте: есть раскрывающийся список для невыбранных вариантов и список для выбранных; похож на предложения Антона Лави, но немного менее продуман.

<style>
select { width: 200px; }
</style>
<body>
 <select id="sel" onchange="list.appendChild(this[this.selectedIndex]);">
  <option disabled>Select items from this list</option>
  <option value="a">a</option>
  <option value="c">c</option>
  <option value="d">d</option>
</select><br>
<select multiple="" id="list"><option value="b">b</option></select>
<button onclick="while(list.selectedIndex > -1) { sel.appendChild(list[list.selectedIndex]); }">Remove selected</button>
</body>

порядок можно сохранить, если отсканировать, чтобы найти правильное место для вставки.

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