title: search on table,real time
body: <p>I have the below table:</p>
  
  <pre><code>&lt;input type="search" class="light-table-filter" id="search" data-
  
  table="order-table" placeholder="Kerko"&gt;
  &lt;table border="0" class=" table table-striped table-hover table-bordered table-condensed tableDemo bordered order-table table" &gt;
  
  &lt;tr id="header"&gt;
     &lt;th&gt;ID&lt;/th&gt;
      &lt;th&gt;emri&lt;/th&gt;
      &lt;th&gt;mbiemri&lt;/th&gt;
      &lt;th&gt;username&lt;/th&gt;
      &lt;th&gt;password&lt;/th&gt;
      &lt;th&gt;email&lt;/th&gt;
      &lt;th&gt;Nr Tel&lt;/th&gt;
      &lt;th&gt;ACTION&lt;/th&gt;
  &lt;/tr&gt;
      &lt;?php
  if(count($records)){
          $i = 1;
          $eachRecord= 0;
          foreach($records as $key=&gt;$eachRecord){
              ?&gt;
  
  
              &lt;tr id="&lt;?=$eachRecord['ID'];?&gt;"&gt;
                  &lt;td&gt;&lt;?=$eachRecord['ID'];?&gt;&lt;/td&gt;
                  &lt;td class="Emri"&gt;&lt;?=$eachRecord['Emri'];?&gt;&lt;/td&gt;
                  &lt;td class="Mbiemri"&gt;&lt;?=$eachRecord['Mbiemri'];?&gt;&lt;/td&gt;
                  &lt;td class="Username"&gt;&lt;?=$eachRecord['Username'];?&gt;&lt;/td&gt;
                  &lt;td class="Password"&gt;&lt;?=$eachRecord['Password'];?&gt;&lt;/td&gt;
                  &lt;td class="Email"&gt;&lt;?=$eachRecord['Email'];?&gt;&lt;/td&gt;
                  &lt;td class="nrtel"&gt;&lt;?=$eachRecord['nrtel'];?&gt;&lt;/td&gt;
                  &lt;td&gt;
                      &lt;a href="javascript:;" id="&lt;?=$eachRecord['ID'];?&gt;" class="ajaxEdit"&gt;&lt;img src="" class="eimage"&gt; &lt;span class="glyphicon glyphicon-pencil"&gt;&lt;/span&gt;&lt;/a&gt;
                      &lt;a href="javascript:;" id="&lt;?=$eachRecord['ID'];?&gt;" class="ajaxDelete"&gt;&lt;img src="" class="dimage"&gt;  &lt;span class="glyphicon glyphicon-trash"&gt;&lt;/span&gt;&lt;/a&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;?php }
      }
  
      ?&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Also,i want to make a real time search and i have the below jquery code:</p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
      (function(document) {
      'use strict';
  
      var LightTableFilter = (function(Arr) {
  
          var _input;
  
          function _onInputEvent(e) {
              _input = e.target;
              var tables = document.getElementsByClassName(_input.getAttribute('data-table'));
              Arr.forEach.call(tables, function(table) {
                  Arr.forEach.call(table.tBodies, function(tbody) {
                      Arr.forEach.call(tbody.rows, _filter);
                  });
              });
          }
  
          function _filter(row) {
              var text = row.textContent.toLowerCase(), val = _input.value.toLowerCase();
              row.style.display = text.indexOf(val) === -1 ? 'none' : 'table-row';
          }
  
          return {
              init: function() {
                  var inputs = document.getElementsByClassName('light-table-filter');
                  Arr.forEach.call(inputs, function(input) {
                      input.oninput = _onInputEvent;
                  });
              }
          };
      })(Array.prototype);
  
      document.addEventListener('readystatechange', function() {
          if (document.readyState === 'complete') {
              LightTableFilter.init();
          }
      });
    })(document); 
  </code></pre>
  
  <p>Everything it works perfectly.But I want to search all rows except the header of table that has id #header.I can't change the jquery code.Also I have tried some different jquery but only the above jquery code works perfect for me. The only issue is that the code when I write something,it find the row but the header hidded.</p>