WouterS
WouterS

Reputation: 131

PHP Ajax not getting the wanted search

A newbie question so please be kind :)

I've made a small search script to lookup values in my database. But when I put in a search result I'm getting all the files in my database. Not just the name I looked for. I'm not a technical person so I was wondering where my mistake sits.

Main search page

        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(document).ready(function(){

                 function search(){

                      var name=$("#search").val();

                      if(name!=""){
                        $("#result").html("<img src='ajax-loader.gif'/>");
                         $.ajax({
                            type:"post",
                            url:"search-database.php",
                            data:"name="+search,
                            success:function(data){
                                $("#result").html(data);
                                $("#search").val("");
                             }
                          });
                      }



                 }

                  $("#button").click(function(){
                     search();
                  });

                  $('#search').keyup(function(e) {
                     if(e.keyCode == 13) {
                        search();
                      }
                  });
            });
        </script>
  </head>
  <body>
        <div id="container">
             <input type="text" id="search" placeholder="Zoek hier uw kandidaat...."/>
             <input type="button" id="button" value="Zoek" />
             <ul id="result"></ul>
        </div>
  </body>
</html>

search-database.php

<?php
include 'dbconfig.php';
?>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Gevonden kandidaten</title>
</head>
<body>
<div id="header">
<label>Resultaten</label>
</div>
<div id="body">
    <table width="80%" border="1">
    <tr>
    <td>File Name</td>
    <td>File Type</td>
    <td>File Size(KB)</td>
    <td>View</td>
    </tr>
    <?php
    $search=$_POST['search'];
    $query = $pdo->prepare("select * from test where name LIKE '%$search%' LIMIT 0 , 10");
    $query->bindValue(1, PDO::PARAM_STR);
    $query->execute();
        while($results= $query->fetch())
        {
        ?>
        <tr>
        <td><?php echo $results['name'] ?></td>
        <td><?php echo $results['type'] ?></td>
        <td><?php echo $results['size'] ?></td>
        <td><a href="uploads/<?php echo $results['file'] ?>" target="_blank">view file</a></td>
        </tr>
        <?php
    }
    ?>
    </table>

</div>
</body>
</html>

Upvotes: 0

Views: 35

Answers (2)

NITIN PATEL
NITIN PATEL

Reputation: 460

Replace your search function with

function search(){
                   var name=$("#search").val();
                    if(name!=""){
                             $("#result").html("<img src='ajax-loader.gif'/>");
                             $.ajax({
                                type:"post",
                                url:"search-database.php",
                                data:"name="+name,
                                success:function(data){
                                    $("#result").html(data);
                                    $("#search").val("");
                                }
                           });
                      }

                 }

Upvotes: 1

roberto06
roberto06

Reputation: 3864

Here :

var name=$("#search").val();

You're setting your input value to a variable named name, but here :

data:"name="+search,

You're sending a non-existent value named search to your PHP file (in $POST['name']).

Hence, $_POST['search'] is empty, and your SQL request is :

select * from test where name LIKE '%%' LIMIT 0 , 10

Which returns all results.

You should replace your data line in your AJAX call to :

data:"search="+name,

Upvotes: 1

Related Questions