Плагин автозаполнения JQuery в стиле Facebook

Im после того, как плагин выполнит автозаполнение, например, в facebook, вы можете выбрать несколько элементов - похожее на то, как работает тегирование проблемы stackoverflow.

Вот пара, с которой я столкнулся:

Вы пробовали какие-либо из них? Были ли их легко реализовать и настроить?

Ответы

Ответ 1

https://github.com/loopj/jquery-tokeninput

Я просто пошел на это, и было очень просто реализовать, используя страницу asp.net для вывода JSON (из параметров поиска) Тогда theres всего несколько строк Javascript, которые вам нужно создать (и настройки)

$(document).ready(function() {
        $("#Users").tokenInput("../Services/Job/UnassignedUsers.aspx?p=<%= projectID %>&j=<%= jobID %>", {
        hintText: "Begin typing the user name of the person you wish to assign.",
        noResultsText: "No results",
        searchingText: "Searching..."
    });
});

Ответ 2

Это очень хорошо! https://github.com/wuyuntao/jquery-autosuggest/

Как использовать его

Очевидно, вам нужно убедиться, что у вас есть последняя библиотека jQuery (в менее 1,3), уже загруженных на вашу страницу. После этого это действительно просто, просто добавьте следующий код на свою страницу (обязательно оберните свой код в функции jQuery ready):

$(function(){
    $("input[type=text]").autoSuggest(data);
});

В приведенной выше строке кода применяется AutoSuggest ко всему типу текста inputэлементов на странице. Каждый из них будет использовать один и тот же набор данных. Если вы хотите иметь несколько полей AutoSuggest на своей странице, которые используют различные наборы данных, убедитесь, что вы выбрали их отдельно. подобно это:

$(function(){
    $("div.someClass input").autoSuggest(data);
    $("#someID input").autoSuggest(other_data);
});

Выполнение вышеизложенного позволит вам передать различные параметры и различные наборы данных. Ниже приведен пример использования AutoSuggest с Объект данных и другие различные параметры:

var data = {items: [
    {value: "21", name: "Mick Jagger"},
    {value: "43", name: "Johnny Storm"},
    {value: "46", name: "Richard Hatch"},
    {value: "54", name: "Kelly Slater"},
    {value: "55", name: "Rudy Hamilton"},
    {value: "79", name: "Michael Jordan"}
]};
$("input[type=text]").autoSuggest(data.items, {selectedItemProp: "name", searchObjProps: "name"});

Ответ 4

Это оригинальный плагин автозаполнения JQuery, прежде чем он был интегрирован в JQueryUI. Если вы хотите обслуживать только JQuery, но не всю библиотеку JQueryUI, используйте эту. Я использовал это в прошлом и был доволен этим.

http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

Ответ 7

Меня впечатлило autosuggest devbridge. Высоко настраиваемый