javascript - JQuery Autocomplete from Database

I need to to do autoplete suggestion for my website and the data should be retrieved from database. I want to use JQuery autoplete. here is my code but it doesn't work! This is my php file with the name of gethint.php:

<?php
require_once ('config.php');
$q=$_REQUEST["q"]; 
$sql="SELECT `fname` FROM `Property` WHERE fname LIKE '%$q%'";
$result = mysql_query($sql);
$json=array();

while($row = mysql_fetch_array($result)) {
  $json[]=array(
  'value'=> $row['fname'],
  'label'=> $row['fname']
   );
   }
   echo json_encode($json);
  ?>

and then this is my html file :

<html>
<head>
<script type="text/javascript" src=".7.2/jquery.min.js"></script> 
<script type="text/javascript" src=".8.18/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href=".8/themes/base/jquery-ui.css" />
 <script type="text/javascript"> 
 $(document).ready(function(){                  
 $("#hint").autoplete({                        
 source:'gethint.php', 
 minLength:1                  
   }); 
   });        
</script>
</head>
<body>
<form class="sansserif" action="view.php" method="post">
Name: <input type="text" id="hint" name="hint" >
<input type="submit" name="submit" value="View">
</form>
</html>

It took a lot of time but I couldn't find the problem. I was wondering if someone could help me. Thanks.

<?php
require_once ('config.php');
$q=$_REQUEST["q"]; 
$sql="SELECT `fname` FROM `Property` WHERE fname LIKE '%$q%'";
$result = mysql_query($sql);
$json=array();

while($row = mysql_fetch_array($result)) {
  $json[]=array(
  'value'=> $row['fname'],
  'label'=> $row['fname']
   );
   }
   echo json_encode($json);
  ?>

and then this is my html file :

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis./ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis./ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis./ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" />
 <script type="text/javascript"> 
 $(document).ready(function(){                  
 $("#hint").autoplete({                        
 source:'gethint.php', 
 minLength:1                  
   }); 
   });        
</script>
</head>
<body>
<form class="sansserif" action="view.php" method="post">
Name: <input type="text" id="hint" name="hint" >
<input type="submit" name="submit" value="View">
</form>
</html>

It took a lot of time but I couldn't find the problem. I was wondering if someone could help me. Thanks.

Share Improve this question edited Aug 28, 2014 at 15:55 asked Aug 28, 2014 at 15:49 user2011036 291 gold badge1 silver badge6 bronze badges

Have you tried to remove the [] from $json[] = array...? Just leave $json = array(... – pecci Commented Aug 28, 2014 at 16:13
I tried this one as well bu again not working! – user2011036 Commented Aug 28, 2014 at 16:18
btw thanks for your hint – user2011036 Commented Aug 28, 2014 at 16:19

Add a ment |

3 Answers 3

Sorted by: Reset to default 3

<?php
 require_once ('..\config.php');
 $q=$_REQUEST["term"]; 
 $sql="SELECT `fname` FROM `Property` WHERE fname LIKE '%$q%'";
 $result = mysql_query($sql);

 while($row = mysql_fetch_array($result)) {
  $json[]=array(
   'value'=> $row['fname'],
   'label'=> $row['fname']
  );
 }
 echo json_encode($json);
?>

All I changed was the $_REQUEST["q"] to $_REQUEST["term"].

I did some changes, maybe you need to fix something but take a look to see if helps...

The php:

<?php
    require_once ('config.php');

    $q=$_REQUEST["q"]; 
    $sql="SELECT `fname` FROM `Property` WHERE fname LIKE '%$q%'";
    $result = mysql_query($sql);

    $json=array();

    while($row = mysql_fetch_array($result)) {
      array_push($json, $row['fname']);
    }

    echo json_encode($json);
?>

The html+jquery:

<html>
    <head>
        <script src="//code.jquery./jquery-1.10.2.js"></script>
        <script src="//code.jquery./ui/1.11.1/jquery-ui.js"></script>
        <link rel="stylesheet" type="text/css" href="http://ajax.googleapis./ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" />
    </head>
    <body>
        <form class="sansserif" action="view.php" method="post">
            Name: <input type="text" id="hint" name="hint" />
            <input type="submit" name="submit" value="View">
        </form>

        <script type="text/javascript"> 

        $(function() {
            $( "#hint" ).autoplete({
                source: function( request, response ) {
                    $.ajax({
                        url: "gethint.php",
                        dataType: "jsonp",
                        data: {
                            q: request.term
                        },
                        success: function( data ) {
                            response( data );
                        }
                    });
                },
            });
        });     
        </script>
    </body>
</html>

Your PHP script should be accepting a term parameter, not q.

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - JQuery Autocomplete from Database - Stack Overflow

3 Answers 3

与本文相关的文章

评论列表(0)