20170425

jQuery UI Автозаполнение :: Autocomplete

← jQuery UI: Аккордеон :: Accordion :: предварительно следует изучить…

Автозаполнение :: Autocomplete


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


Поиск, вариант 1. Язык программирования (поиск с любого места строки).
Если пользователь набрал символ «p» (англ.), то пользователю предлагается выбор из значений в которых есть хотя бы одна буква «p» (англ.) в любом месте, необязательно в начале.
Далее, если пользователь добавляет букву «h», то система предлагает пользователю выбор из значений в которых есть сочетание «ph», например: «Delphi», «PHP».

Поиск, вариант 2. Язык программирования (поиск строго с начала строки). В отличии от первого варианта выбор предлагается из значений по совпадению вводимых символов строго с началом слова. Т.е., например, при вводе «ph» предлагается только вариант «PHP».

Обратите внимание, что в обоих вариантах используется один и тот же источник данных: массив availableTags

Поиск, вариант 3. Города России (поиск на русском языке с любого места строки).
Поиск можно осуществлять как по современным, так и по старым названиям городов. Например: Волгоград (Сталинград, Царицын).

В отличии от вариантов 1 и 2 в качестве источника данных используется: массив availableCities

В этот массив входят 32 самых крупных города России по численности населения.

Ссылки по теме:
https://jqueryui.com/autocomplete/
http://api.jqueryui.com/autocomplete/

Продолжение темы jQuery UI: Кнопки :: Button →