am attempting to create a searchbox using php. However, when I search code it's not working

Question

<div class="row">
                <?php
                $connection = mysqli_connect('localhost','root','','product-store');
                if(isset($_POST['search'])) {
                    $searchKey = $_POST['search'];
                     $sql = "SELECT * FROM products WHERE code_no LIKE '%$searchKey%'";


                } else {


                    $sql = "SELECT * FROM products order by code_no desc";
                    $searchKey = "";


                }

            ?>
            <form action="tabledata.php" method="POST"> 
                <div class="col-md-12 col-sm-12 col-xs-12">
                    <input type="text" name="search" class="form-control" placeholder="Search By Code" value="<?php echo $searchKey; ?>" > 
                </div>
                <br>
                <div class="input-group">
                    <button class="btn btn-success">Search</button>
                </div>
                <br>
            </form>

            <br>
            <br>

            </div>



        </div>
    </div>
</div>

$(document).ready(function(){ $("#search").keyup(function() { var query = $(this).val(); if (query != "") { $.ajax({ url:"tabledata.php", method:"POST", data:{query:query}, success:function(data) { $('#result').html(data); } }); } $('#searchKey').keyup(function(){ var search = $(this).val(); if(search != '') { load_data(search); } else { load_data(); } }); });

Answer 1

您在输入字段中缺少 id

<input type="text" id="search"  name="search" class="form-control" placeholder="Search By Code" value="<?php echo $searchKey; ?>" >

Answer 2

You are not only missing the id in the input field but you also never execute the query in your php code and fetch the result. And sql injection is possible, sanitize your $searchKey or use prepared statements.

Maybe you can alse place the search query in a differant php file, and create there the html you whant to return to your ajax function.

Maybe this will help:

Create a new php file for your ajax search function like searchData.php

    <?php //searchData.php

if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['query'])) {
  $connection = mysqli_connect('localhost','root','','product-store');

  $searchKey  = $_POST['query']; // Needs to be sanitized to prevent sql injections
  $sql   = mysqli_query($connection, "SELECT * FROM products WHERE code_no LIKE '%$searchKey%'");

  if (mysqli_num_rows($sql) > 0) {
    // Fetch the rows
    $rows = mysqli_fetch_array($sql, MYSQLI_ASSOC);

    $html = '';
    // Loop through all the rows
    foreach ($rows as $row) {
      // Create here your html you want to return to your ajax function
    }

    echo $html;

  } else {
    // No results, echo html/ text to the ajax function to inform the user
  }
}

Change the url in your ajax function to searchData.php the ajax function will then get all the text/html you echo in this file