Facebook style JQuery autocomplete plugin

Im dopo un plugin per fare il completamento automatico come facebook non nel senso che è possibile selezionare più elementi – come avviene per la codifica di un stackoverflow questione funziona.

Qui ci sono un paio mi sono imbattuto in:

Hai provato uno di questi? Erano facili da implementare e personalizzare?

  • Che plugin hai usato?? Sto cercando uno che funziona bene in firefox e IE
  • Attenzione: ho implementato l’uso di JQuery-tokeninput nel mio progetto, e sembra che non solo uno, ma tutti gli altri menzionati qui, vuoi mettere il campo di input su una riga separata. Sembra che non si possono mettere sulla stessa linea, cioè To: [..the field..]. Forse il posizionamento assoluto, o l’uso di tabelle, è la soluzione, ma non mi piace molto, ma forse mi manca qualcosa..
  • JQuery-tokeninput è ora di avere un facebook di stile che permette di mettere più gettoni sulla stessa linea. Vedere la demo.

 

7 Replies
  1. 84

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

    Ho appena avuto un andare a questo ed è stato davvero facile da implementare mediante un asp.net pagina di output JSON (dalla ricerca params)
    Allora theres solo poche righe di codice Javascript, è necessario crearlo (e le impostazioni)

    $(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..."
        });
    });
    • Sembra inoltre che il bug di FireFox
    • L’ultima versione ha molte correzioni di bug.
    • Non supporta la creazione di nuovi tag volare ancora
    • amato questo plugin, ma ha dovuto lasciarlo andare per jqueryUI completamento automatico dal momento che avevo bisogno al volo di supporto
    • Se si sta utilizzando ASP.Net è possibile utilizzare il mio opensourse progetto ASPTokenInput che aggiunge lato server funzionalità di jquery-tokeninput plugin github.com/harindaka/ASPTokenInput/wiki
    • Ricevo questo errore: TypeError: valore non è definito Linea 657. Questo è il codice in linea 657 funzione highlight_term(valore, scadenza) { return valore.sostituire(new RegExp(“(?![^&;]+;)(?!<[^<>]*)(” + termine + “)(?![^<>]*>)(?![^&]+;)”, “gi”), “<b>$1</b>”); } Quello che sembra essere il problema? Aiuto!
    • Io ho provato la demo (loopj.com/jquery-tokeninput) nelle attuali versioni di Chrome (su OSX), FF (onO OSX) e IE8. Ha funzionato in tutti questi.
    • Manca La Fonte Dinamica Di Supporto :((
    • No, una funzione può essere passato nel luogo di origine variabile.
    • La maggior parte dei plugin obsoleti, molti non funziona con le nuove versioni di JQuery. Questo è il migliore che ho trovato: timschlechter.github.io/bootstrap-tagsinput/esempi.
    • Il Migliore!! esattamente quello che mi serviva,non riesco a immaginare la mia vita senza di Stackoverflow. 🙂

  2. 28

    Questo è molto buono! https://github.com/wuyuntao/jquery-autosuggest/

    Come Usarlo

    Ovviamente, è necessario assicurarsi di avere l’ultima libreria jQuery (a
    almeno 1.3) già caricato nella pagina. Dopo di che è davvero semplice,
    basta aggiungere il seguente codice alla vostra pagina (assicurarsi di avvolgere il vostro codice
    in jQuery funzione ready):

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

    La precedente riga di codice si applica AutoSuggest a tutti di tipo testo input
    gli elementi sulla pagina. Ognuno si utilizza lo stesso set di Dati. Se
    si desidera avere più AutoSuggest campi nella pagina che uso
    diversi insiemi di Dati, assicurarsi di selezionare separatamente. Come
    questo:

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

    A fare sopra vi permetterà di passare in diverse opzioni e
    diversi set di Dati. Qui di seguito è un esempio di utilizzo suggerimenti automatici con un
    Oggetto dati e altre varie opzioni:

    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"});
    • Questo è di gran lunga il miglior autosuggest plugin là fuori. Non consentire all’utente di aggiungere dupelicate record!
    • ricco di funzionalità, ma tonnellate di bug. Alla fine, ho creato il mio: the.deerchao.net/TagEditor
    • il tuo lavoro è molto molto bello ,volevo solo sapere se posso legata con il codice C#?Voglio dire, i tag ,anche come farlo al volo con i servizi web ,grazie
    • Per impostazione predefinita, supporta solo i dati JSON recuperati da un url. Ma ci sono tutto il sorgente, è possibile personalizzare tutto ciò che si desidera.
    • hai fatto qualche aggiornamento su questo plugin? Sto cercando di utilizzare, ma per ottenere questo errore TypeError: $$.autocomplete is not a function [Break On This Error] close: function () { qualsiasi aiuto?
    • Scusate ero in vacanza. Hai capito cosa c’è di sbagliato?
    • Sì @deerchao adesso funziona. Comunque grazie 🙂 e spero tu abbia buone vacanze ho bisogno di uno di troppo …

Lascia un commento