Undefined variable 'searchterm' using PHP to search product name from table

See more:

Javascript

PHP

MySQL

HTML5

Hi Team

I am experience some small issue, i am performing a search but the issue now is script file. Lin 19 undefined variable searchTerm on line 19. The results do retrieve back. How do i solve this issue so can able to get the result when search is called, having a new window when data is retrieved?

What I have tried:

<pre><?php
  // Connect to the database
  require_once('dbconn.php');

  // Get the search term from the form
  if (isset($_POST['search'])) {
  $searchTerm = $_POST['search'];
  // rest of your code that uses $searchTerm variable goes here
} else {
  // handle the case where the $_GET['search'] variable is not set
}



  // Prepare the query
  $stmt = $pdo->prepare("SELECT * FROM products WHERE product_name LIKE :searchTerm");

  // Bind the search term to the query
  $stmt->bindValue(':searchTerm', '%'.$searchTerm.'%', PDO::PARAM_STR);

  // Execute the query
  $stmt->execute();

  // Fetch the results
  $results = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>

<?php if (!empty($results)): ?>
  <div class="container">
    <h2>Search Results</h2>
    <table class="table table-striped">
      <thead>
        <tr>
          <th>Product Name</th>
          <th>Description</th>
          <th>Quantity</th>
          <th>Price</th>
          <th>Discount</th>
          <th>Total</th>
        </tr>
      </thead>
      <tbody>
        <?php foreach ($results as $result): ?>
          <tr>
            <td><?php echo $result['product_name']; ?></td>
            <td><?php echo $result['product_desc']; ?></td>
            <td><?php echo $result['quantity']; ?></td>
            <td><?php echo $result['unit_price']; ?></td>
            <td><?php echo $result['discount']; ?></td>
            <td><?php echo $result['total']; ?></td>
          </tr>
        <?php endforeach; ?>
      </tbody>
    </table>
  </div>
<?php else: ?>

No results found.

// jquery file

<pre lang="Javascript">$(document).ready(function() {
    $('#search-form').submit(function(event) {
        event.preventDefault(); // Prevent the form from submitting normally
        var searchQuery = $('#search-input').val(); // Get the user's search query
        $.ajax({
            url: 'search.php', // The PHP script that will handle the search
            type: 'POST',
            data: {
                data: 'search=' + searchQuery,

            },
            success: function(response) {
                // Display the search results on the page
                $('#search-results').html(response);
            },
            error: function() {
                alert('An error occurred while searching. Please try again later.');
            }
        });
    });
});

// html code

<pre>            <div id="search-not-mobile" class="navbar-collapse collapse">
    <form class="navbar-form" action="search.php" id="search-form" method="POST">
        <div class="input-group">
            <input type="text" placeholder="Search....." class="form-control" id="search-input" name="search">

            <div class="input-group-btn">
                <button type="submit" class="btn btn-primary" id="search-button">
                    
                </button>
            </div>
        </div>
    </form>
</div>
<div id="search-results"></div>