PipUI v1.6.0
  • 🌟Введиние
  • 🗃️Скачать
  • ⚠️Начало работы
  • Компоненты
    • Базовый набор
    • Отступы
    • Палитра цветов
    • Grid сетка
    • Панель навигации
    • Выпадающее меню
    • Постраничная навигация
    • Формы
    • Кнопки
    • Полосы прогресса
    • Меню навигации
    • Модальные окна
    • Оповещения
    • Подтверждения действий
    • Вкладки
    • Хлебные крошки
    • Спойлеры
    • Таблицы
    • Панель BB-кодов
    • BB-коды
    • Валидаторы форм
    • Индексы полей ввода
    • Всплывающие подсказки
    • Подсвечивающиеся блоки
    • Всплывающие блоки
    • Слайдер
    • Автозаполнение
    • Селектор тегов
    • Блоки оповещений
    • Селекторы даты и времени
    • Якоря
  • 📧Контакты
  • 🔁GitHub
Powered by GitBook
On this page
  1. Компоненты

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

Автозаполнение помогает автоматический получать данные и выводить их в списке под полем ввода.

Некоторые из параметров, передаваемых обработчику, можно задать через атрибут data-ac-*. Так, например, data-ac-url - задает URL адрес обработчика, data-ac-method - метод передачи обработчику, data-ac-type - тип получаемых данных, data-ac-data - список элементов через запятую, data-ac-min - минимальное кол-во вводимых символов, по которым будет обрабатываются результат.

Остальные параметры можно передать через опции объекта pipui.autocomplete

var ac = new pipui.autocomplete($('#example1'));

    ac
        .setData(tags) // Список элементов в виде строки/массива/объекта
        .setType('json') // Как будут обрабатываться входящие данные
        .setKey('title') // По какому параметру будет производится поиск
        .setMin(5) // Минимальное кол-во символов для активации поиска
        .setParams(formdata) // По умолчанию в запросе передается только параметр value, но вы можете добавить к нему дополнительные параметры через объект formData
        .setURL('') // URL адрес, на который будет отправлен запрос
        .setMethod('POST') // Метод передаваемых данных. По умолчанию используется GET
        .setTimer(300) // Задержка при поиске результатов. По умолчанию 300
        .setResults(10) // Максимальное кол-во выдаваемых результатов. По умолчанию 10
        .setInput(element) // Объект поля ввода
        .setTemplateSelector('<li class="autocomplete-item"><a href="#" class="autocomplete-link" data-index="{KEY}" rel="nofollow">{title}</a></li>') // Изменение шаблона элемента по умолчанию. В качестве зарезервированных шаблонных ключей можно использовать: {KEY} - ключ элемента списка; {VALUE} - значение элемента списка; {ИМЯ_ПАРАМЕТРА} - любой ключ из объекта
        .setTemplateBlock('...html...'); // Изменение шаблона блока списка по умолчанию. В качестве зарезервированных шаблонных ключей можно использовать {ID} - уникальный ID блока автозаполнения; {ITEMS} - список найденных элементов
PreviousСлайдерNextСелектор тегов

Last updated 2 years ago