How to Create Quick Search using PHP/MySQL with jQuery

Submitted by alpha_luna on Tuesday, July 26, 2016 - 13:26.
In this tutorial, we are going to create Quick Search using PHP/MySQL with jQuery. Search query using PHP/MySQL is a PHP source code that the users enable to quick search in the table. Creating TextBox for the user where they can type their desired word to quick search data and the table with our data in a data table.

Let's Begin

  • Creating Markup
  • Creating Database Connection
  • Creating PHP Script
First, we are going to create our simple HTML source code. Kindly copy and paste this markup to your BODY tag of your page. 
  1. <div class="container">
  2.     <div class="row-fluid">
  3.         <div class="span12">
  4. <br />
  5. <br />
  6.             <div class="row-fluid">
  7.                 <div class="span6">
  8.                     <div class="span6">
  9.                         <form method="POST" action="search.php" class="navbar-search pull-left">
  10.                             <input type="text" name="search" class="search-query" placeholder="Search">
  11.                         </form>
  12.                     </div>
  13. <br />
  14. <br />
  15. <br />
  16.                     <table class="table table-bordered  table-hover table-striped" style="width:800px;"> 
  17.                         <thead>
  18.                             <tr>
  19.                                 <th>Title</th>
  20.                                 <th>Author</th>
  21.                                 <th>Category</th>
  22.                                 <th>Year Publication</th>
  23.                                 <th>Place Publication</th>
  24.                             </tr>
  25.                         </thead>
  26.                         <tbody>
  27.                             <?php
  28.                                 $query=mysql_query("select * from book")or die(mysql_error());
  29.                                 while($row=mysql_fetch_array($query)){
  30.                                 ?>
  31.  
  32.                                 <tr>
  33.                                     <td><?php echo $row['title']; ?></td>
  34.                                     <td><?php echo $row['author']; ?></td>
  35.                                     <td><?php echo $row['category']; ?></td>
  36.                                     <td><?php echo $row['year_publication']; ?></td>
  37.                                     <td><?php echo $row['place_publication']; ?></td>
  38.                                 </tr>
  39.                                 <?php
  40.                                 }
  41.                             ?>
  42.                         </tbody>
  43.                     </table>
  44.                 </div>
  45.             </div>
  46.         </div>
  47.     </div>
  48. </div>
Second, create a database connection for our data that we are going to save in the database. Database name is "search_query". 
  1. <?php
  2.  
  3. mysql_select_db('search_query',mysql_connect('localhost','root',''))or die(mysql_error());
  4.  
  5. ?>
Third, our PHP script where we can filter those desired words that enter by the user to search in the TextBox. 
  1. <table class="table table-bordered  table-hover table-striped" style="width:800px;"> 
  2.     <thead>
  3.         <tr>
  4.             <th>Title</th>
  5.             <th>Author</th>
  6.             <th>Category</th>
  7.             <th>Year Publication</th>
  8.             <th>Place Publication</th>
  9.         </tr>
  10.     </thead>
  11.     <tbody>
  12. <?php
  13. if (isset($_POST['search'])){
  14.  
  15.     $search=$_POST['search'];
  16.  
  17.     $query=mysql_query("select * from book where category like '%$search%' or title like '%$search%' or 
  18. 	author like '%$search%' or year_publication like '%$search%' or place_publication like '%$search%' ")or die(mysql_error());
  19.     while($row=mysql_fetch_array($query)){
  20.     ?>
  21.     <tr>
  22.         <td><?php echo $row['title']; ?></td>
  23.         <td><?php echo $row['author']; ?></td>
  24.         <td><?php echo $row['category']; ?></td>
  25.         <td><?php echo $row['year_publication']; ?></td>
  26.         <td><?php echo $row['place_publication']; ?></td>
  27.     </tr>
  28.     <?php
  29.     }}
  30.     ?>
  31. </tbody>
  32. </table>
After compiling those source codes above, this would be the result after the user type their desired words to quick search using TextBox on the table as you can see in the image below. Result Hope that this simple tutorial that I created may help you to your future projects. Also, for the beginners who want to learn basic of coding in PHP/MySQL. If you are interested in programming, we have an example of programs that may help you even just in small ways. If you want more tutorials, you can visit our website, click here Share us your thoughts and comments below. Thank you so much for dropping by and reading this tutorial post. For more updates, don’t hesitate and feel free to visit this website more often and please share this with your friends or email me at [email protected]. Practice Coding. Thank you very much.

Tags

Add new comment

About text formats
  • 867 views