Блог

Наши новости, публикации и мысли.

Открытие саджеста (автокомплита) по фокусу в поле Typeahead AngularUI

При использовании замечательной библиотеки AngularUI для AngularJS может возникнуть проблема со стандартной директивой Typeahead из набора для Bootstrap. Дизайнер UI/UX может потребовать отображать список по фокусу в данном поле, даже при условии, что оно пустое.
На момент написания заметки использовалась библиотека версии 0.7.0 и данная возможность еще не была предусмотрена. Я нашел несколько пулл реквестов почти годовой давности, которые так и не влили в основную ветку проекта, чтобы решить эту проблему. Ничего, решим это своими силами.
Начнем с самой директивы, здесь всё в принципе понятно:

Находим элемент и вешаем на него соответствующее событие. Стоит пояснить два момента
1) Почему «click»? Потому что, если повесим обработчик на «focus», список откроется снова после выбора элемента из подгрузившегося списка, т.к. typeahead возвращает фокус в поле ввода.
2) Зачем отправлять пробел, если нет значения?
Обратимся к коду самой библиотеки и найдем там строки:

Первое условие всё нам и портит при отправке пустого значения. Пробел же можно (и нужно) спокойно тримить на бекенде,

Также, для выполнения условия minSearch можно установить на «-1» с помощью атрибута typeahead-min-length.

Данное решение позволяет не вносить изменения в код самой библиотеки. Буду рад услышать другие варианты.

Последние записи

  • После завершения создания сайта встает вопрос об оптимизации загрузки кода. Минификация javascript файлов позволяет уменьшить их размер путем удаления лишних символов, при этом обычно используют обфускацию, т.е....
    04 февраля 2014
  • Создать сайт для предприятия малого бизнеса не сложно. Трудности начнутся, когда вы захотите привлечь на свой новый сайт трафик. Да и качество самого трафика нужно разделять, ведь...
    03 ноября 2013
  • Дано: Таблица объектов и таблица городов, имеющие связь MANY_MANY; Yii Framework v.1.1.14; Задача: организовать редактирование связей и поиск объектов по массиву id городов, используя стандартные средства фреймворка.
    30 сентября 2013
  • Специфика наполнения сайта контентом обсуждалась неоднократно, и существует множество мнений по поводу того, кто должен писать для веба, и может ли этим заниматься непосредственно сам заказчик. И...
    10 июля 2013