Horje Website
PHP MySQLi Ajax Live Search – PHP & Mysqli Code

First, Create mysql Username, Password and Database from PHPnysql Admin

 

Import the code to your database

 
 
  1. CREATE TABLE countries ( id INT NOT NULL PRIMARY KEY AUTO_INCREMENT, name VARCHAR(50) NOT NULL );

 

Secondly, Create a filename index.php and save the code insert this file, then upload it to your public_html

 
 
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>PHP Live MySQL Database Search</title>
  6. <style>
  7. body{
  8. font-family: Arail, sans-serif;
  9. }
  10. /* Formatting search box */
  11. .search-box{
  12. width: 300px;
  13. position: relative;
  14. display: inline-block;
  15. font-size: 14px;
  16. }
  17. .search-box input[type="text"]{
  18. height: 32px;
  19. padding: 5px 10px;
  20. border: 1px solid #CCCCCC;
  21. font-size: 14px;
  22. }
  23. .result{
  24. position: absolute;
  25. z-index: 999;
  26. top: 100%;
  27. left: 0;
  28. }
  29. .search-box input[type="text"], .result{
  30. width: 100%;
  31. box-sizing: border-box;
  32. }
  33. /* Formatting result items */
  34. .result p{
  35. margin: 0;
  36. padding: 7px 10px;
  37. border: 1px solid #CCCCCC;
  38. border-top: none;
  39. cursor: pointer;
  40. }
  41. .result p:hover{
  42. background: #f2f2f2;
  43. }
  44. </style>
  45. <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
  46. <script>
  47. $(document).ready(function(){
  48. $('.search-box input[type="text"]').on("keyup input", function(){
  49. /* Get input value on change */
  50. var inputVal = $(this).val();
  51. var resultDropdown = $(this).siblings(".result");
  52. if(inputVal.length){
  53. $.get("backend-search.php", {term: inputVal}).done(function(data){
  54. // Display the returned data in browser
  55. resultDropdown.html(data);
  56. });
  57. } else{
  58. resultDropdown.empty();
  59. }
  60. });
  61. // Set search input value on click of result item
  62. $(document).on("click", ".result p", function(){
  63. $(this).parents(".search-box").find('input[type="text"]').val($(this).text());
  64. $(this).parent(".result").empty();
  65. });
  66. });
  67. </script>
  68. </head>
  69. <body>
  70. <div class="search-box">
  71. <input type="text" autocomplete="off" placeholder="Search country..." />
  72. <div class="result"></div>
  73. </div>
  74. </body>
  75. </html>

 

Finally, Create another filename backend-search.php then, Insert the following code and save it. Upload the file to public_html

Modify: localhost”, “root”, “”, “demo” according to your mysql username, password, database name from line-4

 
 
  1. <?php
  2. /* Attempt MySQL server connection. Assuming you are running MySQL
  3. server with default setting (user 'root' with no password) */
  4. $link = mysqli_connect("localhost", "root", "", "demo");
  5. // Check connection
  6. if($link === false){
  7. die("ERROR: Could not connect. " . mysqli_connect_error());
  8. }
  9. if(isset($_REQUEST["term"])){
  10. // Prepare a select statement
  11. $sql = "SELECT * FROM countries WHERE name LIKE ?";
  12. if($stmt = mysqli_prepare($link, $sql)){
  13. // Bind variables to the prepared statement as parameters
  14. mysqli_stmt_bind_param($stmt, "s", $param_term);
  15. // Set parameters
  16. $param_term = $_REQUEST["term"] . '%';
  17. // Attempt to execute the prepared statement
  18. if(mysqli_stmt_execute($stmt)){
  19. $result = mysqli_stmt_get_result($stmt);
  20. // Check number of rows in the result set
  21. if(mysqli_num_rows($result) > 0){
  22. // Fetch result rows as an associative array
  23. while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)){
  24. echo "<p>" . $row["name"] . "</p>";
  25. }
  26. } else{
  27. echo "<p>No matches found</p>";
  28. }
  29. } else{
  30. echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
  31. }
  32. }
  33. // Close statement
  34. mysqli_stmt_close($stmt);
  35. }
  36. // close connection
  37. mysqli_close($link);
  38. ?>
Published:
December 20, 2022
Author:
admin
Category:
PHP Source Code
Views:
21

This article was posted in PHP Source Code. Bookmark the permalink. Follow comments with the RSS feed for this post.Post a Comment or leave a trackback: Trackback URL.

Leave a Reply

Your email address will not be published. Required fields are marked *

 

Horje © 2011 - 2023