Facebook style JQuery autocomplete plugin

Im after a plugin to do autocomplete like facebook does in that you can select multiple items - similar to how tagging a stackoverflow question works.

Here are a couple I ran into:

Have you tried any of these? Were they easy to implement and customize?

Answers


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

I just had a go at this one and it was really easy to implement using an asp.net page to output the JSON (from the search params) Then theres just a few lines of Javascript you need to create it (and the settings)

$(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..."
    });
});

This one very good! https://github.com/wuyuntao/jquery-autosuggest/

How To Use It

Obviously you need to make sure you have the latest jQuery library (at least 1.3) already loaded in your page. After that it's really simple, just add the following code to your page (make sure to wrap your code in jQuery's ready function):

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

The above line of code will apply AutoSuggest to all text type input elements on the page. Each one will be using the same set of Data. If you want to have multiple AutoSuggest fields on your page that use different sets of Data, make sure you select them separately. Like this:

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

Doing the above will allow you to pass in different options and different Data sets. Below is an example of using AutoSuggest with a Data Object and other various options:

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"});

Here's what I've found, in no particular order:


if you are looking for user mentions feature like fb and tw, this is good plugin http://podio.github.io/jquery-mentions-input/


This is the original JQuery autocomplete plugin before it was integrated into JQueryUI. If you are looking to serve just JQuery but not the entire JQueryUI library, use this one. I have used this one in the past and have been happy with it.

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


I found this one. Seems robust, well-maintained and is responsive.

http://ivaynberg.github.io/select2/


I was quite impressed with the devbridge autosuggest. Highly customizable


Need Your Help

Password strength check in PHP

php validation passwords

I am trying to create a password check script. I already have checks for email (for not allowed characters) like this: