title: Filter table data with Jquery based on HTML input
body: <p>Can you please help me code Jquery right way so i can filter HTML table based on text input. So far this is my code:</p>
  
  <pre><code>    &lt;input type="text" name="inputdata" id="inputdata" onkeyup="filter()"&gt;
      &lt;table&gt;
              &lt;tr&gt;
                  &lt;th&gt;ID&lt;/th&gt;
                  &lt;th&gt;Name&lt;/th&gt;
              &lt;/tr&gt;
              &lt;tr name="data"&gt;
                 &lt;?php foreach ($products as $row) { ?&gt;
                   &lt;td&gt;&lt;?php echo $row-&gt;id_product; ?&gt;&lt;/td&gt;
                   &lt;td&gt;&lt;?php echo $row-&gt;name; ?&gt;&lt;/td&gt;
                 &lt;?php }  ?&gt;
              &lt;/tr&gt;
  </code></pre>
  
  <p>Jquery code</p>
  
  <pre><code>&lt;script&gt;
      function filter(){
          inp = $('#inputdata').val()
          $("tr").filter(function() {
              return $(this).text().indexOf(inp) == -1;
          }).hide();
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>So my problems are:</p>
  
  <ol>
  <li>Search is case sensitive</li>
  <li>When i input some string, let's say Pants, Jquery filters data, but then i have to refresh a page, so i can search again. Or let me put this other way... When i delete inputted data in search field, table isn't refreshed. It just stay on Pants data, so for another search i have to reload web page</li>
  <li><code>&lt;th&gt;</code> are removed when searching for data. If i declare <code>$('tr[name=data]').filter(function() {</code> search stop working</li>
  </ol>
  
  <p>thx in advance for helping me!</p>