Wie HTML-Tabelle zu filtern - JS

Question

Ich habe ein Eingabefeld (Suchfeld), um meine HTML-Tabelle zu filtern. Meine Frage ist in der Lage, die Tabelle in Ordnung zu filtern, aber wenn ich das Suchfeld zu löschen ist es nicht die bereits vorhandenen Daten

Zum Beispiel bringen, wenn ich

MacBook 
Acer 

und ich suche nach M

es zeigt MacBook die

in Ordnung ist, aber wenn ich die M aus dem Suchfeld zu löschen, sieht die Tabelle immer noch wie

MacBook 

statt

MacBook 
    Acer 

JS

<script> 
$(document).ready(function() { 
     var typingTimer;    //timer identifier 
     var doneTypingInterval = 100; //time in ms (5 seconds) 

     $("#query").on('keyup', function() { 
      clearTimeout(typingTimer); 
      if ($('#query').val()) { 
       typingTimer = setTimeout(doneTyping, doneTypingInterval); 
      } 
     }); 
    }); 

    function doneTyping() { 
     var key = $('#query').val(); 

      $.ajax({ 
       url: 'search/?query='+key, 
       type: 'GET', 
       beforeSend: function() { 
       // $("#table").slideUp('fast'); 

       }, 
       success: function (data) { 
        console.log(data); 
        $("#table").slideDown('fast'); 

        var table = $("#table tbody"); 

         table.html(""); 
         $.each(data, function(idx, elem){ 
          table.append(

           //appending rows here 

          ); 

         }); 




       }    

      }); 


} 
</script> 

Answer 1

Dieser Code:

$("#query").on('keyup', function() { 
     clearTimeout(typingTimer); 
     if ($('#query').val()) { 
      typingTimer = setTimeout(doneTyping, doneTypingInterval); 
     } 
    }); 

zu einem keyup Ereignis binded ist (ok) aber aussehen, wenn $ wird ('# Abfrage ') hat einen Wert:

if ($('#query').val()) { 

Wenn Sie das Eingabefeld leeren, ist diese Bedingung falsch.

Entfernen Sie einfach die if-Bedingung und das wird funktionieren.

$("#query").on('keyup', function() { 
    clearTimeout(typingTimer); 
    typingTimer = setTimeout(doneTyping, doneTypingInterval); 
});