Wie filtern Sie Ihre jquery-autocomplete Daten während der Eingabe

Bisher habe ich die folgenden

var aCleanData = ['aaa','aab','faa','fff','ffb','fgh','mmm','maa'];

$('#my-input').autocomplete({
    source:aCleanData,
    minLength:2
});

Wenn Sie derzeit geben aa, aaa,aab,faa,maa wird sich zeigen.

Was ich gerne tun würde, ist, wenn der Benutzer Arten ff die Daten, die gezeigt werden, die fff,ffb Daten.

Grundsätzlich nur das, was eingegeben wird, abgestimmt werden sollte ab dem ersten Zeichen ab.

Diese sollten rekursiv sein. Wenn der Benutzer die Typen fg, fff,ffb sollten verschwinden und nur fgh erscheinen soll.

Dank im Voraus für Eure Hilfe.

UPDATE:

p.s. Sehen, was ich hier meine:

http://jqueryui.com/demos/autocomplete/#default

Typ sc und Sie sehen mehr als nur die Daten beginnend mit sc.

Die AutoVervollständigen verwenden Sie? Der von docs.jquery.com/Plugins/Autocomplete ausführen sollten, wie Sie wollen
Das ist das eine und seine Durchführung, wie oben beschrieben.
Kommen Sie, daran zu denken, ich bin mit dem ui-autocomplete. Ist das nicht das gleiche?

InformationsquelleAutor HGPB | 2011-10-12

  1. 11

    Eine mögliche Lösung, um nur die Ergebnisse, beginnend mit dem input-Wert zur überprüfung der array-Elemente vor der Suche nach sich selbst:

    var aCleanData = ['aaa','aab','faa','fff','ffb','fgh','mmm','maa'];
$('#my-input').autocomplete({
    source: aCleanData,
    minLength: 2,
    search: function(oEvent, oUi) {
        //get current input value
        var sValue = $(oEvent.target).val();
        //init new search array
        var aSearch = [];
        //for each element in the main array ...
        $(aCleanData).each(function(iIndex, sElement) {
            //... if element starts with input value ...
            if (sElement.substr(0, sValue.length) == sValue) {
                //... add element
                aSearch.push(sElement);
            }
        });
        //change search array
        $(this).autocomplete('option', 'source', aSearch);
    }
});

    Siehe auch meine jsfiddle.

    Freekin " Genie!
    Ich mag die Tatsache, die Sie gehalten haben, die Ungarische notation style - Details ist alles!
    Ich werde versuchen, fügen Sie einen Standardwert für alle suchen . eg; innerhalb jeder Funktion, die ich hinzufügen else if(sElement.value === 'SMTHNG_DEFAULT') forscht,push(sElement); aber es funktioniert nicht nehmen Sie meine Standard-Wert bis auf AutoVervollständigen, und nicht in meiner dropdown-Liste. Haben Sie irgendwelche Vorschläge?

    InformationsquelleAutor scessor

  2. 3

    Nach einem Blick auf die Quelle für autocomplete, haben Sie ein paar Optionen. Sie konnte schreiben Sie Ihre eigenen pasrer Methode, die zurückgibt, was Sie brauchen und legen Sie es als callback-Quelle. Dies ist wahrscheinlich mehr von den "richtigen" Weg, es zu tun.

    Der schnellere Weg ist, einfach die folgende Zeile hinzufügen, NACHDEM Sie die Benutzeroberfläche Quelle:

    $.ui.autocomplete.escapeRegex=function(){ 
    return '[^|\s]' + $value.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");   
};

    Wenn Sie sich interessieren, wie das funktioniert (oder funktionieren sollte, habe ich noch nicht getestet):

    Den original-code erweitert die Benutzeroberfläche.autocomplete mit 2 statische Funktionen:

    $.extend( $.ui.autocomplete, {
escapeRegex: function( value ) {
    return value.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
},
filter: function(array, term) {
    var matcher = new RegExp( $.ui.autocomplete.escapeRegex(term), "i" );
    return $.grep( array, function(value) {
        return matcher.test( value.label || value.value || value );
    });
}
});

    Alle sollten Sie tun müssen, ist zu ändern, was escapeRegex gibt die Suche nach dem Anfang, wenn die Worte nur. Indem der Wert des escapeRegex zurück '[^|\s]' vor dem original zurück, wir sagen: "Schauen Sie für die Arbeit mit einem Leerzeichen vor oder ist der Anfang der Zeile"

    Vielen Dank für die post. Ich fand die Suche-Taste option @scessor vorgeschlagen, als einen guten Ansatz.

    InformationsquelleAutor Law Metzler

  3. 1

    Ich glaube, Sie verwenden die jQuery-UI - Autocomplete. Die Suche und geben Sie nicht die gleiche Weise, die Sie tun möchten. Aber diese eine ist möglicherweise Abdeckung für Ihren Bedarf.

    Wenn ich mich nicht Irre sind Sie jetzt die gleiche Sache: Zitate aus der bassistance.de/jquery-plugins/jquery-plugin-autocomplete "Dieses plugin ist veraltet und wird nicht mehr weiterentwickelt. Sein Nachfolger ist Teil von jQuery UI" Dies ist, was ich verwende.

    InformationsquelleAutor kst

Schreibe einen Kommentar