Правильно ли редактируется поле выбора?

Question

У меня есть сценарий, когда пользователь отправляет электронное письмо другому пользователю в веб-приложении на основе HTML.

В поле «Кому» пользователь может выбрать один из предварительно определенных списков электронных писем ИЛИ ввести свои собственные, игнорируя предварительно определенные параметры.

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

Есть ли какой-нибудь другой механизм пользовательского интерфейса, который бы работал здесь? * +1007 *

Answer 1

Вы можете попробовать использовать что-то вроде плагина jQuery autocomplete .Это даст вам текстовое поле, в которое вы можете просто ввести адрес электронной почты, но также предоставит возможность выбора набора адресов электронной почты, которые можно выбрать вместо этого.Работая с настройками плагина, вы можете сделать так, чтобы набор адресов появлялся (как выбираемый список), как только поле получило фокус.Эта семантика похожа на текстовое поле + select, но я думаю, что интерфейс выглядит менее загроможденным.

Answer 2

Мне нравится делать так, чтобы ввод текста вел себя как фильтр для выпадающего списка. Пользователь может либо выбрать что-то из списка, либо ввести несколько символов для фильтрации или продолжить ввод и создать уникальную строку. Поместите свойство размера, скажем, 6 в SELECT, чтобы оно отображалось как выбираемый список вместо кнопки.

<div>
  <input id="mySelectInput type="text" onchange="filterSelect()"/><br/>
  <select id="mySelect" size="6">
    <!-- array of options -->
  </select>
</div>

Тогда просто напишите свой filterSelect () function

Answer 3

Вы можете использовать смешанный подход: доступное для записи поле, в котором предлагаются предложения по адресам, в то время как пользователь пишет адрес, как это делает Gmail, или, как мне кажется, другие системы веб-почты.

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