Question posted in
You can find the official documentation here.

Jquery ajax – making php on-input search but jquery $.ajax and $.post not working

i am trying to make a live search box using ajax using the following code but its not working. When i echo "hello"; from the php file and remove everything else it just echos it out on the screen and does not work, no errors or return values, leading me to believe it has to do with my jquery code but i am not sure.

jquery:

$("#search").keyup(function(){
var value = $("#search").val();
$.post(walldb.php, {value: value}, function(data){
console.log(data);
})
});

heres the php:

<?php
$arr = [];
$searchq = "%{$_POST['value']}%";
$stmt = $pdo->prepare("SELECT * FROM walldb WHERE wallname LIKE :s");
$stmt->bindParam(':s',$searchq);
$result=$stmt->execute();
while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
  $mlink = $row['mainlink'];
  $tlink = $row['thumbnail'];
  $dlink = $row['download'];
  $info = $row['info'];
  $val = $row['wallname'];
  $arr[] = '<li>' . "<a href=" . "$mlink" . " data-lightbox='searchwall'> <img class='searchicon' src=" . "$tlink" . "></a>" . "<span>" . "$val" . "</span><img class='searchbutton1 s1' src='/images/info.png'>" . '<br>' . "<a id='wall1.download' href=" . "$dlink" . "><img class='searchbutton2' src='/images/download.png'></a>" . '<br>' . "<ul class='searchmenu menu1'><p>" . "$info" . "</p>
  </ul>" . '</li>';
}
$final = '<ul>' . implode('', $arr) . '</ul>';
echo $final; //just echos everything on the screen :(
?>

html:

<form action= "" method= "post">
  <a href="#"><img id="glass" src="/images/search.png" type= "submit" name="submit-search"></a><input id="search" name="search-input" type="search" placeholder="Search By Name" autocomplete="off"><a href="#"><img id="cancle" src="/images/cancle.png"></a>
</form>

i would also appreciate some help on making the whole thing work making it search on input since i am very new to pdo/php.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    i fixed this issue by using generic javascript XMLHttpRequest, jquery never worked for me and i have no idea why. I would love to receive some insight as to why my below solution works and the jquery version does not (i am using the latest version of jquery).

    javascript: 

    $("#search").keyup(function () {
  var http = new XMLHttpRequest();
 var value = $("#search").val();
  http.open("POST", 'walldb.php', true);
  http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  http.onload = function () {
    if (this.status == 200) {
      $("#result").html(this.responseText);
    }
  }
  http.send("value=" + value);
});

    php:

    <?php
$arr = [];
$searchq = "%{$_POST['value']}%";
$stmt = $pdo->prepare("SELECT * FROM walldb WHERE wallname LIKE :searchq");
$stmt->bindParam(':searchq',$searchq);
$result=$stmt->execute();
while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
  $mlink = $row['mainlink'];
  $tlink = $row['thumbnail'];
  $dlink = $row['download'];
  $info = $row['info'];
  $val = $row['wallname'];
  $arr[] = '<li>' . "<a href=" . "$mlink" . " data-lightbox='searchwall'> <img class='searchicon' src=" . "$tlink" . "></a>" . "<span>" . "$val" . "</span><img class='searchbutton1 s1' src='/images/info.png'>" . '<br>' . "<a id='wall1.download' href=" . "$dlink" . "><img class='searchbutton2' src='/images/download.png'></a>" . '<br>' . "<ul class='searchmenu menu1'><p>" . "$info" . "</p>
  </ul>" . '</li>';
}
$final = '<ul>' . implode('', $arr) . '</ul>';
if (isset($_POST['value'])) {  //added this
echo $final;
}
?>

  2. 0

    Try to correct that:

    $stmt = $pdo->prepare('SELECT * FROM walldb WHERE wallname LIKE ?');
$stmt->execute([$searchq]);

    to

    $searchq = '%' .$_POST['value']. '%'; //edited 
$stmt = $pdo->prepare('SELECT * FROM walldb WHERE wallname LIKE ?');
$stmt->bind_param('s', $searchq);
$stmt->execute();
while($row= $stmt->fetch_assoc()){

    Or PDO

    $searchq = '%' .$_POST['value']. '%'; //edited 
$stmt= $pdo->prepare('SELECT * FROM walldb WHERE wallname LIKE :searchq');
$stmt->bindParam(':searchq', $searchq, PDO::PARAM_STR);
$stmt->execute();
while($row= $stmt->fetch_assoc()){
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search