На этом шаге мы рассмотрим сценарий заполнения поля поиска.
Наш список вариантов дополнения будет не слишком полезен без возможности вставлять выбранный вариант в поле ввода. Для начала мы дадим пользователю возможность подтверждать выбор щелчком мыши:
'success': function(data) {
if (data.length) {
$autocomplete.empty();
$.each(data, function(index, term) {
$('<li></li>').text(term).appendTo($autocomplete)
.click(function() {
$('#search-text').val(term);
$autocomplete.hide();
});
});
$autocomplete.show();
}
}
Рис.1. Занесение текста в поле поиска
Данное изменение выполняет запись текста в поле поиска, когда выполняется щелчок на элементе списка. Кроме того, после щелчка мы скрываем список вариантов, так как работа с ним на этом заканчивается.
На следующем шаге мы рассмотрим навигацию с помощью клавиатуры.