jQuery DataTables: Verzögern Sie die Suche, bis 3 Zeichen eingegeben oder eine Schaltfläche angeklickt wurden

82

Gibt es bitte eine Option, um die Suche erst zu starten, nachdem 3 Zeichen eingegeben wurden?

Ich habe ein PHP-Skript für Kollegen geschrieben, das 20.000 Einträge anzeigt, und sie beschweren sich, dass beim Eingeben eines Wortes die ersten Buchstaben dazu führen, dass alles einfriert.

Eine Alternative wäre, die Suche durch Klicken auf eine Schaltfläche und nicht durch Eingabe von Zeichen zu starten.

Unten ist mein aktueller Code:

$("#my_table").dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "bAutoWidth": false,
        "aoColumns": [
                /* qdatetime */   { "bSearchable": false },
                /* id */          null,
                /* name */        null,
                /* category */    null,
                /* appsversion */ null,
                /* osversion */   null,
                /* details */     { "bVisible": false },
                /* devinfo */     { "bVisible": false, "bSortable": false }
        ],
        "oLanguage": {
                "sProcessing":   "Wait please...",
                "sZeroRecords":  "No ids found.",
                "sInfo":         "Ids from _START_ to _END_ of _TOTAL_ total",
                "sInfoEmpty":    "Ids from 0 to 0 of 0 total",
                "sInfoFiltered": "(filtered from _MAX_ total)",
                "sInfoPostFix":  "",
                "sSearch":       "Search:",
                "sUrl":          "",
                "oPaginate": {
                        "sFirst":    "<<",
                        "sLast":     ">>",
                        "sNext":     ">",
                        "sPrevious": "<"
                },
                "sLengthMenu": 'Display <select>' +
                        '<option value="10">10</option>' +
                        '<option value="20">20</option>' +
                        '<option value="50">50</option>' +
                        '<option value="100">100</option>' +
                        '<option value="-1">all</option>' +
                        '</select> ids'
        }
} );
Alexander Farber
quelle

Antworten:

75

Lösung für Version 1.10 -

Nachdem ich hier nach einer vollständigen Antwort gesucht und keine gefunden habe, habe ich diese geschrieben (unter Verwendung von Code aus der Dokumentation und einigen Antworten hier).

Der folgende Code verzögert die Suche, bis mindestens 3 Zeichen eingegeben wurden:

// Call datatables, and return the API to the variable for use in our code
// Binds datatables to all elements with a class of datatable
var dtable = $(".datatable").dataTable().api();

// Grab the datatables input box and alter how it is bound to events
$(".dataTables_filter input")
    .unbind() // Unbind previous default bindings
    .bind("input", function(e) { // Bind our desired behavior
        // If the length is 3 or more characters, or the user pressed ENTER, search
        if(this.value.length >= 3 || e.keyCode == 13) {
            // Call the API search function
            dtable.search(this.value).draw();
        }
        // Ensure we clear the search if they backspace far enough
        if(this.value == "") {
            dtable.search("").draw();
        }
        return;
    });
zufälliger_Benutzername
quelle
3
Wenn Sie Probleme haben, dies zum Laufen zu bringen, versuchen Sie es in diesem init.dtFall, z $('#yourTable').on('init.dt', function () { ... });.
Arao6
In Version 11 müssen Sie zuerst die Suchzeichenfolge festlegen und dann fnDraw () wie folgt ausführen: $ (". Datatable"). DataTable (). Api (). Search ("aaaa2"); $ (". datatable "). dataTable (). fnDraw ()
Hesham Yassin
2
Ich hatte Eingabe anstelle von Keydown-Funktion, es funktioniert jetzt gut. Vielen Dank
Azza Idz
1
@Maxime Ich habe es auf die Bearbeitung zurückgesetzt, die funktioniert hat, und diese fehlerhaften Variablennamen stimmen nicht überein. Lassen Sie mich wissen, wenn Sie der Meinung sind, dass noch Änderungen / Aufmerksamkeit erforderlich sind.
random_user_name
1
@cale_b Ich kann bestätigen, dass dies für 1.10.16 noch funktioniert. Danke dir.
AnotherDeveloper
77

Hinweis: Dies war für eine viel frühere Version von Datentabellen. Weitere Informationen finden Sie in dieser Antwort für jQuery-Datentabellen v1.10 und höher.


Dadurch wird das Verhalten des Eingabefelds so geändert, dass nur gefiltert wird, wenn entweder die Eingabetaste gedrückt wurde oder mindestens 3 Zeichen in der Suche enthalten sind:

$(function(){
  var myTable=$('#myTable').dataTable();

  $('.dataTables_filter input')
    .unbind('keypress keyup')
    .bind('keypress keyup', function(e){
      if ($(this).val().length < 3 && e.keyCode != 13) return;
      myTable.fnFilter($(this).val());
    });
});

Sie können es hier sehen: http://jsbin.com/umuvu4/2 . Ich weiß nicht, warum die dataTables-Leute sowohl an den Tastendruck als auch an den Tastendruck gebunden sind, aber ich überschreibe beide, um kompatibel zu bleiben, obwohl ich denke, dass der Tastendruck ausreichend ist.

Hoffe das hilft!

Richard
quelle
2
Bemerkte dies auch. Durch die Bindung an Tastendruck und Tastendruck wird die Abfrage zweimal ausgelöst. Für diejenigen, die zu Hause zuschauen, sollten Sie einfach das eine oder andere aus dem Unbind herausnehmen und binden.
Thunder Rabbit
1
Diese Lösung funktioniert nicht, wenn Sie die Rücktaste drücken. @ Sam Barnes ist die beste Antwort
Idrees Khan
2
Als Alternative zu ausgezeichneter Antwort Sam Barnes, können Sie dies ändern Konto für backspacing (und das Feld löscht) durch Ersetzen e.keycode != 13mit e.keyCode > 13, die auch Feuer , wenn sie Registerkarte aus dem Feld.
Cincodenada
2
Leider funktioniert dies nicht mit Version 1.10
random_user_name
Nach dem, was @ThunderRabbit sagte, war der beste Weg, beide zu lösen, aber nur den einen oder anderen wieder zu binden. .unbind('keypress keyup') .bind('keypress', function(e) ...
Nageeb
33

Warum probieren Sie nicht diese erweiterte Version von Stony's Antwort :)

var searchWait = 0;
var searchWaitInterval;
$('.dataTables_filter input')
.unbind('keypress keyup')
.bind('keypress keyup', function(e){
    var item = $(this);
    searchWait = 0;
    if(!searchWaitInterval) searchWaitInterval = setInterval(function(){
        if(searchWait>=3){
            clearInterval(searchWaitInterval);
            searchWaitInterval = '';
            searchTerm = $(item).val();
            oTable.fnFilter(searchTerm);
            searchWait = 0;
        }
        searchWait++;
    },200);

});

Dies verzögert die Suche, bis der Benutzer die Eingabe beendet hat.

Ich hoffe es hilft.

Sam Barnes
quelle
funktioniert gut. Ich muss jedoch oTable.fnFilter (...) ändern, um auf meine Datentabelleninstanz zu verweisen.
YudhiWidyatama
Dies ist keine wirklich erweiterte Version, sondern eine völlig andere (aber nützliche) Lösung. Ich bin jedoch verwirrt darüber, was der Parameter searchWait bewirkt, was nicht erreicht werden kann setTimeout(function(){...}, 600), da die Funktion bei weiteren Zeichen nicht erneut ausgelöst zu werden scheint.
Cincodenada
@cincodenada muss ein sein setInterval, da es alle 200/600 ms erneut ausgelöst wird und prüft, ob searchWait nicht auf 0 zurückgesetzt wurde. Wenn Sie beispielsweise weiterhin etwas in die Eingabe eingeben, wird searchWait immer auf 0 zurückgesetzt = Suche wird nie ausgeführt. Ich finde jedoch die Verwendung von searchWait als Ganzzahl, die bis 3 zählt, ziemlich dunkel. Besser wäre nur eine True / False-Flagge, wenn Benutzereingaben passieren und eine setIntervalvon 600.
r3mark
3
Seit jqueryDatatables 1.10.3 gibt es eine Option dafür: searchDelay
panmari
1
@panmari - searchDelay verzögert nur die Suche um die angegebene Zeit und zeichnet die Tabelle anschließend (Ajax auslösen) neu, nicht wenn der Benutzer aufgehört hat zu tippen, was die meisten von uns erwarten.
Chris Landeza
11

Hier erfahren Sie, wie Sie mit der API-Änderung in Version 1.10 umgehen können

var searchbox = $('#promogrid_filter input');
var pgrid = $('#promogrid').DataTable();

//Remove default datatable logic tied to these events
searchbox.unbind();

searchbox.bind('input', function (e) {
   if(this.value.length >= 3) {
      pgrid.search(this.value).draw();
   }
   if(this.value == '') {
      pgrid.search('').draw();
   }
   return;
});
Chad Kuehn
quelle
7

Hier ist ein Plugin-ähnliches Skript, das Datentabellen erweitert.

jQuery.fn.dataTableExt.oApi.fnSetFilteringEnterPress = function ( oSettings ) {
    var _that = this;

    this.each( function ( i ) {
        $.fn.dataTableExt.iApiIndex = i;
        var
            $this = this, 
            oTimerId = null, 
            sPreviousSearch = null,
            anControl = $( 'input', _that.fnSettings().aanFeatures.f );

            anControl
              .unbind( 'keyup' )
              .bind( 'keyup', function(e) {

              if ( anControl.val().length > 2 && e.keyCode == 13){
                _that.fnFilter( anControl.val() );
              }
        });

        return this;
    } );
    return this;
}

Verwendung:

$('#table').dataTable().fnSetFilteringEnterPress();
Christian Noel
quelle
Willst du nicht "wenn die Länge mehr als 2 ist oder die Eingabetaste gedrückt wird?if ( anControl.val().length > 2 || e.keyCode == 13)
Jeromy French
Ja, das funktioniert auch. Ich konzentriere mich nur mehr auf die Validierungsseite, sodass selbst dann nichts passiert, wenn eine leere Zeichenfolge übergeben und die Eingabetaste gedrückt wird.
Christian Noel
7

Meine Version der Datentabellen 1.10.10

Ich habe ein paar Dinge geändert und es funktioniert jetzt. Ich teile also, weil es schwierig war, es für Version 1.10.10 zum Laufen zu bringen. Vielen Dank an cale_b, Stony und Sam Barnes. Schauen Sie sich den Code an, um zu sehen, was ich getan habe.

    var searchWait = 0;
    var searchWaitInterval;
    $('.dataTables_filter input')
    .unbind() // leave empty here
    .bind('input', function(e){ //leave input
        var item = $(this);
        searchWait = 0;
        if(!searchWaitInterval) searchWaitInterval = setInterval(function(){
            if(searchWait >= 3){
                clearInterval(searchWaitInterval);
                searchWaitInterval = '';
                searchTerm = $(item).val();
                oTable.search(searchTerm).draw(); // change to new api
                searchWait = 0;
            }
            searchWait++;
        },200);

    });
Zante
quelle
6

Um den Serveraufruf aufzurufen, nachdem der Benutzer die Mindestzeichen in das Suchfeld eingegeben hat, können Sie Allans Vorschlag folgen :

Anpassen der fnSetFilteringDelay () Plug-In - API - Funktion eine zusätzliche Bedingung auf der String - Länge hinzuzufügen , bevor die Filtereinstellung, auch einen leeren String - Eingang unter Berücksichtigung des Filters löschen

Ändern Sie für mindestens 3 Zeichen einfach Zeile 19 im Plug-In in:

if ((anControl.val().length == 0 || anControl.val().length >= 3) && (sPreviousSearch === null || sPreviousSearch != anControl.val())) {
Marius Butuc
quelle
5

Dies funktioniert in DataTables 1.10.4:

var table = $('#example').DataTable();

$(".dataTables_filter input")
    .unbind()
    .bind('keyup change', function(e) {
        if (e.keyCode == 13 || this.value == "") {
            table
                .search(this.value)
                .draw();
        }
    });

JSFiddle

Márcio Souza Júnior
quelle
4

Für die Version 1.10 fügen Sie diesen Code in den Optionen zu Ihrem Javascript hinzu. Die initComplete überschreibt die Suchmethode und wartet, bis 3 Zeichen geschrieben sind. Vielen Dank an http://webteamalpha.com/triggering-datatables-to-search-only-on-enter-key-press/ für das Licht.

    var dtable= $('#example').DataTable( {
        "deferRender": true,
        "processing": true,
        "serverSide": true,


        "ajax": "get_data.php",
        "initComplete": function() {
            var $searchInput = $('div.dataTables_filter input');

            $searchInput.unbind();

            $searchInput.bind('keyup', function(e) {
                if(this.value.length > 3) {
                    dtable.search( this.value ).draw();
                }
            });
        }

    } );
} );
Mato Gallardo
quelle
3

Benutze das

   "fnServerData": function (sSource, aoData, fnCallback, oSettings) {

            if ($("#myDataTable_filter input").val() !== "" && $("#myDataTable_filter input").val().length < 3)
                return;
            oSettings.jqXHR = $.ajax({
                "dataType": 'json',
                "timeout":12000,
                "type": "POST",
                "url": sSource,
                "data": aoData,
                "success": fnCallback
            });
        }
Nitin Bourai
quelle
+1 Schön. Dies lässt sich gut in die Definition der Datentabellen integrieren. Übrigens war es in meinem Fall ausreichend, nicht das gesamte aoData-Objekt zurückzugeben, sondern nur aoData [5] ['Wert'] ['Wert'] (der im Eingabefeld eingegebene Text).
Werner
3

Obwohl es die ursprüngliche Frage nicht beantwortet, hatte ich eine komplexe und langsame Suche in meinen Datentabellen. Das Filterereignis wurde nach jedem Tastendruck ausgelöst, was eine merkliche Verzögerung nach 10 Zeichen bedeutete. Durch die Einführung einer kurzen Verzögerung nach einem Tastendruck vor dem Auslösen des Filterereignisses, bei der ein nachfolgender Tastendruck den Zähler zurücksetzte und die vorherige Suche verhinderte, konnte ich die Suche viel schneller erscheinen lassen. andere mögen dies hilfreich finden.

Ich habe die Antworten von Stony und Christian Noel verwendet, um dies zu machen:

var dataTableFilterTimeout;
var dataTableFilterWait = 200; // number of milliseconds to wait before firing filter

$.fn.dataTableExt.oApi.fnSetFilteringEnterPress = function ( oSettings ) {
    var _that = this;
    this.each( function ( i ) {
        $.fn.dataTableExt.iApiIndex = i;
        var $this = this;
        var oTimerId = null;
        var sPreviousSearch = null;
        anControl = $( 'input', _that.fnSettings().aanFeatures.f );
        anControl.unbind( 'keyup' ).bind( 'keyup', function(e) {
            window.clearTimeout(dataTableFilterTimeout);
            if ( anControl.val().length > 2 || e.keyCode == 13){
                dataTableFilterTimeout = setTimeout(function(){
                    _that.fnFilter( anControl.val() );
                },dataTableFilterWait);
            }
        });
        return this;
    } );
    return this;
}
pgee70
quelle
3

Sie können den Ajax-Aufruf an den Server dadurch verzögern

var search_thread = null;
    $(".dataTables_filter input")
        .unbind()
        .bind("input", function(e) { 
            clearTimeout(search_thread);
            search_thread = setTimeout(function(){
                var dtable = $("#list_table").dataTable().api();
                var elem = $(".dataTables_filter input");
                return dtable.search($(elem).val()).draw();
            }, 300);
        });

Dieser Code stoppt den Ajax-Aufruf, wenn die Zeit zwischen dem Drücken der Taste weniger als 300 ms beträgt. Wenn Sie also ein Wort schreiben, wird nur ein Ajax-Aufruf ausgeführt und nur, wenn Sie aufhören zu tippen. Sie können mit dem Verzögerungsparameter (300) "spielen", um mehr oder weniger Verzögerung zu erhalten

zion ben yacov
quelle
2

Sie müssen wahrscheinlich das Plugin ändern.

Und anstatt es zu X-Zeichen zu machen, verwenden Sie eine Verzögerung, damit die Suche beginnt, sobald sie etwa 1 Sekunde lang nicht mehr tippen.

Die Keydown / Keyup-Bindung, die derzeit die Suche auslöst, würde also mit einem Timer geändert ...

var timer;
clearTimeout(timer);
timer = setTimeout(searchFunctionName, 1000 /* timeToWaitInMS */);
smdrager
quelle
1
Mit "Plugin ändern" meinen Sie das Bearbeiten von jquery.dataTables.js? Und wissen Sie, wie Sie es danach "minimieren" können?
Alexander Farber
2

Feste Version für Datentabellen 1.10.12 mit API und korrekter Entbindung der 'Eingabe'. Außerdem wurde die Suche auf der Rücktaste unter der Zeichenbeschränkung gelöscht.

    // Create the Datatable
    var pTable = $('#pTable').DataTable();

    // Get the Datatable input box and alter events
    $('.dataTables_filter input')
    .unbind('keypress keyup input')
    .bind('keypress keyup input', function (e) {
        if ($(this).val().length > 2) {
            pTable.search(this.value).draw();
        } else if (($(this).val().length == 2) && (e.keyCode == 8)) {
            pTable.search('').draw();
        }
    });
Tino
quelle
2

Wenn Sie die alte Version verwenden, sieht es so aus. Richards Lösung funktioniert gut. Aber wenn ich es benutze, habe ich nur neue Ereignisse hinzugefügt und nicht gelöscht. Denn wenn Code ausgeführt wird, ist die Tabelle noch nicht erstellt. Also fand ich heraus, dass es die fnInitComplete-Methode gibt (Feuer beim Erstellen einer Tabelle) und habe sie auf Ricards Lösung angewendet. Hier ist es

$("#my_table").dataTable( {
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "bAutoWidth": false,
         ...
         ...,
         "fnInitComplete": function (oSettings, json) {
                    var activeDataTable = $(this).DataTable();
                    $("#my_table_filter input")
                        .unbind('keypress keyup')
                        .bind('keypress keyup', function (e) {

                        if ($(this).val().length < 3 || e.keyCode !== 13) return;
                        activeDataTable.fnFilter($(this).val());
                    });
                }
cihancoskun
quelle
2

Sie können diesen Code für Medtronic-Datentabellen oder anderen Code verwenden, um nach Verwendung von 3 Zeichen zu suchen:

        onDataLoad: function (RequestGrid) {
            // execute some code on ajax data load
            var searchInput = $('div.dataTables_filter input').val();
            if (searchInput.length() > 3 || searchInput.length() ==0) {
                alert(searchInput);
                dt.draw();
            }
            else {
                return false;
            }
        },

searchInput.length () == 0 für die erste Show.

LPLN
quelle
1

Können Sie eine eigene Funktion schreiben, um die Länge der eingegebenen Zeichenfolge zu testen, die an einen onKeyUp-Ereignishandler angehängt ist, und die Suchfunktion auslösen, sobald die Mindestlänge erreicht ist?

Etwas in der Art von:

input.onKeyUp (function () {
    if (input.length> 3) {
        mySearchfunction ();
    }}
});

... das heißt, auf eine Art Pseudocode, aber Sie bekommen den Jist.

Chris
quelle
1

Sie können den Parameter nach Name minlength verwenden, um die Suche auf 3 Zeichen zu beschränken:

function(request, response) {
    $.getJSON("/speakers/autocomplete", {  
        q: $('#keywordSearch').val()
    }, response);
}, minLength: 3
Lokesh S.
quelle
1

Die Länge der Daten, die übergeben werden, können Sie mit data.currentTarget.value.length ermitteln (siehe unten).

$('[id$="Search"]').keyup(function (data) {
            if (data.currentTarget.value.length > 2 || data.currentTarget.value.length == 0) {
                if (timoutOut) { clearTimeout(timoutOut); }
                timoutOut = setTimeout(function () {
                    var value = $('[id$="Search"]').val();
                    $('#jstree').jstree(true).search(value);
                }, 250);
            }
        });

und natürlich möchten Sie, dass dieser Code beim Entfernen von Text ausgeführt wird. Setzen Sie den Wert daher auf 0

Tom McDonough
quelle
0

Dies funktioniert mit DataTables Version 1.10.19. Es ist nur erforderlich, die js in Ihre Website-Vorlage aufzunehmen - nützlich für eine Site, auf der mehrere dataTables auf verschiedenen Seiten konfiguriert sind. Auch nützlich für langsame xhr-Ladetabellen, lässt keine neuen xhr-Anforderungen zu, bis alle aktuell ausgeführten beendet sind. Die verwendete Suchfunktion ist der ursprünglichen Einrichtung der Suchfunktion durch das Plugin sehr ähnlich .

(function(window, document, $){
var xhring = 0;

$(document).on( 'preXhr.dt', function () {
    xhring++;
} );
$(document).on( 'xhr.dt', function () {
    xhring--;
} );

//at a minimum wait the full freq, and wait for any pending XHR requests to finish before calling fn
function choke( fn, freq ) {
    var
        frequency = freq !== undefined ? freq : 200,
        last,
        timerFn,
        timer;

    return function () {
        var
            that = this,
            args = arguments;

        timerFn = function () {
            if (xhring || +new Date() < last + frequency) {
                clearTimeout( timer );
                timer = setTimeout( timerFn, frequency);
            } else {
                fn.apply( that, args );
            }
        }
        last = +new Date();

        clearTimeout( timer );
        timer = setTimeout( timerFn, frequency );
    };
}

//See https://github.com/DataTables/DataTables/blob/156faa83386460c578e00c460eca9766e38a0c5f/media/js/jquery.dataTables.js
//See https://github.com/DataTables/Plugins/blob/master/features/searchHighlight/dataTables.searchHighlight.js
$(document).on( 'preInit.dt', function (e, settings, json) {
    var previousSearch = settings.oPreviousSearch;

    var searchFn = function() {
        /* Update all other filter input elements for the new display */
        var val = !this.value ? "" : this.value; // mental IE8 fix :-(

        /* Now do the filter */                                                                                                  
        if ( val != previousSearch.sSearch && (val.length >= 3 || val == "")) {
            $.fn.dataTable.ext.internal._fnFilterComplete( settings, {
                "sSearch": val,
                "bRegex": previousSearch.bRegex,
                "bSmart": previousSearch.bSmart ,
                "bCaseInsensitive": previousSearch.bCaseInsensitive
            } );

            // Need to redraw, without resorting
            settings._iDisplayStart = 0;
            $.fn.dataTable.ext.internal._fnDraw( settings );
        }
    };

    var searchDelay = settings.searchDelay !== null ?                                                                            
        settings.searchDelay :
        $.fn.dataTable.ext.internal._fnDataSource( settings ) === 'ssp' ?
            700 :
            200;

    var jqFilter = $( 'input', settings.aanFeatures.f )
        .off('keyup.DT search.DT input.DT paste.DT cut.DT')
        .on('keyup.DT search.DT input.DT paste.DT cut.DT', choke(searchFn, searchDelay))
        ;
} );

})(window, document, jQuery);
Seite? ˅
quelle
-1

Gibt es einen Grund, warum Sie die Länge nicht einfach auf "Ändern" überprüfen würden?

$('.input').change(function() {
  if( $('.input').length > 3 ) {
     //do the search
  }
});
Jimyshock
quelle
2
Weil DataTables bereits daran gebunden ist und die Suche automatisch aufruft. Sie müssen die Bindungen abfangen / ändern.
random_user_name
-1

Sie müssen die Datei jquery.datatables.js ändern

----- Natürlich aktualisiert Sie können die Länge> 3 überprüfen, aber ich denke, Sie brauchen noch einen Timer. Wenn Sie viele Daten haben, möchten Sie diese nicht nach jeder Charakteraktualisierung weiter filtern lassen.

Innerhalb dieser Methode:

jqFilter.keyup( function(e) {
            if ( **this.value**.length > 3) {
                var n = oSettings.aanFeatures.f;
                for ( var i=0, iLen=n.length ; i<iLen ; i++ )
                {
                    if ( n[i] != this.parentNode )
                    {
                        $('input', n[i]).val( this.value );
                    }
                }
                /* Now do the filter */
                _fnFilterComplete( oSettings, { 
                    "sSearch": this.value, 
                    "bRegex":  oSettings.oPreviousSearch.bRegex,
                    "bSmart":  oSettings.oPreviousSearch.bSmart 
                } );
         }
        } );

Fügen Sie dem Keyup einen Timer hinzu, wie in einer der Antworten gezeigt.

Dann gehen Sie zu dieser Seite http://jscompress.com/

Und nach Ihrem geänderten Code werden die js minimiert.

Tahir Malik
quelle
Hallo, danke - aber könnte ich anstelle eines Timers ein $ ('. Input'). Length> 3 oder $ (# input '). Length> 3 check hinzufügen? Ich bin mir jedoch nicht sicher, wie ich auf das Suchfeld verweisen soll.
Alexander Farber
Natürlich können Sie die Länge> 3 überprüfen, aber ich denke, Sie brauchen noch einen Timer. Wenn Sie viele Daten haben, möchten Sie diese nicht nach jeder Charakteraktualisierung weiter filtern lassen. Ich habe die Antwort mit der richtigen Überprüfung der Länge über 3 Zeichen aktualisiert. Das Hinzufügen des Timers ist der nächste wertvolle Schritt.
Tahir Malik