title: PHP & Javascript: Dynamic search with 2 textbox
body: <p>Is there any way to have a dynamic search with 2 textbox to filter 2 different fields?</p>
  
  <p>for example i have a table like:</p>
  
  <p><a href="https://i.stack.imgur.com/3FHuy.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/3FHuy.jpg" alt="enter image description here"></a></p>
  
  <p>and i have created somethin like this:
  <a href="https://i.stack.imgur.com/tBboi.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/tBboi.jpg" alt="enter image description here"></a></p>
  
  <p>it already works in the LASTNAME textbox.</p>
  
  <p>i want is that when i enter a lastname with same lastnames like this:
  <a href="https://i.stack.imgur.com/DTnZB.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DTnZB.jpg" alt="enter image description here"></a></p>
  
  <p>i want to add another filter by firstname, so that when i enter a firstname on the FIRSTNAME textbox example i enter PEDRO in the FIRSTNAME textbox only PEDRO A. Dela Cruz will show up.</p>
  
  <p>This is my Codes</p>
  
  <p>Index.php</p>
  
  <pre><code> &lt;script type="text/javascript"&gt;
  $(function(){
  $(".lname").keyup(function() 
  { 
  var value = $(this).val();
  var dataString = 'lname='+ value;
  if(searchlname!='')
  {
      $.ajax({
      type: "POST",
      url: "search.php",
      data: dataString,
      cache: false,
      success: function(html)
      {
      $("#result").html(html).show();
      }
      });
  }return false;    
  });
  
  jQuery("#result").live("click",function(e){ 
      var $clicked = $(e.target);
      var $name = $clicked.find('.name').html();
      var decoded = $("&lt;div/&gt;").html($name).text();
      $('#searchlname').val(decoded);
  });
  jQuery(document).live("click", function(e) { 
      var $clicked = $(e.target);
      if (! $clicked.hasClass("search")){
      jQuery("#result").fadeOut(); 
      }
  });
  $('#searchlname').click(function(){
      jQuery("#result").fadeIn();
  });
  });
  &lt;/script&gt;
  
      &lt;div class="content"&gt;
      Lastname:
      &lt;input type="text" class="lname" id="searchlname" placeholder="Search for people" /&gt;&lt;br /&gt;
      Firstname:
      &lt;input type="text" class="search" id="" placeholder="Search for people" /&gt;&lt;br /&gt; 
  &lt;div id="result"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>search.php</p>
  
  <pre><code>&lt;table width="80%"&gt;
      &lt;th width="5%"&gt;ID&lt;/th&gt;
      &lt;th width="40%"&gt;Name&lt;/th&gt;
      &lt;th width="10%"&gt;Action&lt;/th&gt;
  &lt;/table&gt;
  
  &lt;?php
  $connection = mysql_connect('localhost','root','admin') or die(mysql_error());
  $database = mysql_select_db('dbvincent') or die(mysql_error());
  
  if($_POST)
  {
  $search_name=$_POST['lname'];
  $sql_res=mysql_query("SELECT * FROM `tblpatients` WHERE `lname` LIKE '%$search_name%' order by `patient_id` LIMIT 15");
  
  while($row=mysql_fetch_array($sql_res))
  {
  $id = $row['patient_id'];   
  $fname = $row['fname'];
  $mname = $row['mname'];
  $lname = $row['lname'];
  ?&gt;
  &lt;table width="80%"&gt;
      &lt;td width="5%"&gt;&lt;?php echo $id ; ?&gt;&lt;/td&gt;
      &lt;td width="40%"&gt;&lt;?php echo $fname.' '.$mname.' '.$lname; ?&gt;&lt;/td&gt;
      &lt;td width="10%"&gt;&lt;button formaction="echoid.php?id=&lt;?php echo $id ?&gt;"&gt;Add&lt;/button&gt;&lt;/td&gt;
  &lt;/table&gt;
  
  &lt;?php
  </code></pre>
  
  <p>thanks you.</p>