javascriptphpajaxlivesearch

How do i send ajax function values from a page to another


I have this input field that reads the user' input in "index.php"

<input type="text" name="medname" id="medname" class="search-input" placeholder="Search..." name="">
       
<div class="result"></div>

Then this AJAX live search function receives the input, sends it to "livesearch.php" file to search the database for matching data. Then receives a paragraphe element to display it as a search result.

AJAX function in "index.php"

<script>
    $(document).ready(function() {
      $('.search input[type="text"]').on("keyup input", function() {
        /* Get input value on change */
        var inputVal = $(this).val();
        var resultDropdown = $(this).siblings(".result");
        if (inputVal.length) {
          $.get("livesearch.php", {
            term: inputVal
          }).done(function(data) {
            // Display the returned data in browser
            resultDropdown.html(data);
          });
        } else {
          resultDropdown.empty();
        }
      });

      // Set search input value on click of result item
      $(document).on("click", ".result p", function() {
        $(this).parents(".search").find('input[type="text"]').val($(this).text());
        $(this).parent(".result").empty();
      });
    });
  </script>

livesearch.php

if(isset($_REQUEST["term"])){
    // Prepare a select statement
    $sql = "SELECT * FROM medicine WHERE mName LIKE ?";
    
    if($stmt = mysqli_prepare($link, $sql)){
        // Bind variables to the prepared statement as parameters
        mysqli_stmt_bind_param($stmt, "s", $param_term);
        
        // Set parameters
        $param_term = $_REQUEST["term"] . '%';
        
        // Attempt to execute the prepared statement
        if(mysqli_stmt_execute($stmt)){
            $result = mysqli_stmt_get_result($stmt);
            
            // Check number of rows in the result set
            if(mysqli_num_rows($result) > 0){
                // Fetch result rows as an associative array
                while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)){
                    echo "<p>" . $row["mName"] . "</p>";
                }
            } else{
                echo "<p>No matches found</p>";
            }
        } else{
            echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
        }
    }

Now for my problem a have another page called "map.php". I need to send "mID : Id of a medicine" and "mName : Name of a medicine" that the user's selected to that page.

How can i do that?


Solution

  • I solved the issue by using json. I don't understand it very much but it works(CSS not included).

    index.php

    <script>
       jQuery(document).ready(function($) {
        $('#keyword').on('input', function() {
            var searchKeyword = $(this).val();
            if (searchKeyword.length >= 1) {
                $.post('search.php', { keywords: searchKeyword }, function(data) {
                    $('ul#content').empty().addClass('active');
                    $.each(data, function() {
                        $('ul#content').append('<li><a href="map.php?id=' + this.id + '">' + this.title + '</a></li>');
                    });
                }, "json");
            } else {
                $('ul#content').empty().removeClass('active');
            }
        });
    });
      </script>
    

    index.php (Input and results field)

    <form method="POST">
            <input type="text" id="keyword" class="search-input" placeholder="Search..." name="">
            <ul class="result" id="content"></ul>
            </form>
    
    

    search.php

    <?php
    define('DB_USER', 'root');
    define('DB_PASSWORD', '');
    define('DB_SERVER', 'localhost');
    define('DB_NAME', 'pharmacie');
    if (!$db = new mysqli(DB_SERVER, DB_USER, DB_PASSWORD, DB_NAME)) {
        die($db->connect_errno.' - '.$db->connect_error);
    }
    $arr = array();
    if (!empty($_POST['keywords']) && strlen($_POST['keywords']) >= 1) {
        $keywords = filter_var($_POST['keywords'], FILTER_SANITIZE_STRING);
        $keywords = $db->real_escape_string($keywords);
        $sql = "SELECT mID, mName FROM medicine WHERE mName LIKE '%".$keywords."%'";
        $result = $db->query($sql) or die($mysqli->error);
        if ($result->num_rows > 0) {
            while ($obj = $result->fetch_object()) {
                $arr[] = array('id' => $obj->mID, 'title' => $obj->mName);
            }
        }
    }
    echo json_encode($arr);