Jquery和PHP,自动完成

时间:2015-07-07 22:17:02

标签: javascript php jquery html autocomplete

所以我刚刚发现了jquery auto complete,我想将它添加到我的网页中。我想把它连接到我的PHP代码,所以我可以搜索我的SQL数据库。然而,每当我尝试运行我的自动完成,它似乎没有找到我传递的PHP数组(我只是想让一个数组现在工作)。有人可以帮忙吗?

Jquery代码

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery UI Autocomplete - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <script>
  $(function() {
    $( "#tags" ).autocomplete({
      source: "test.php"
    });
  });
  </script>
</head>
<body>

<div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags">
</div>


</body>
</html>

PHP代码

<?php
    $data[] = array(
        'c++','Java','JavScript',"c#" );
echo json_encode($data);
?>

5 个答案:

答案 0 :(得分:1)

此处使用的数组模式应如下所示。

<?php
$data = array(
    array("value"=>'C++'),
    array("value"=>'Java'),
    array("value"=>'Javascript'),
    array("value"=>'C#'),
);
echo json_encode($data);

答案 1 :(得分:1)

如果你正在使用PHP&gt; = 5.4:

$data = [
    [ 'value' => 'C++' ],
    [ 'value' => 'Java' ],
    [ 'value' => 'Javascript' ],
    [ 'value' => 'C#' ]
];
echo json_encode( $data );

以下是我的自动填充代码的工作示例:

function get_data(type, target, min_length )
{
    $(target).autocomplete({
        source: function( request, response ) {
            var submit = {
                term: request.term,
                type: type
            };
            $.ajax({
                url: '/request/get',
                data: { thisRequest: submit},
                dataType: "json",
                method: "post",
                success: function( data ) {
                    response($.map( data.Data, function( item ) {

                        return {
                            label: item.label,
                            value: item.label
                        }
                    }));
                }
            });
        },
        minLength: min_length
    })
}

答案 2 :(得分:1)

这是您的答案的更新版本,应该可以解决已弃用的SQL驱动程序和注入问题。您需要将SECOND_COLUMNNAME替换为您实际的列名称。除此之外,我认为这应该有用。

<?php
try {
    $dbh = new PDO('mysql:host=localhost;dbname=DB','username','password');
} catch (PDOException $e) {
    print "Error!: " . $e->getMessage() . "<br/>";
    die();
}
if(empty($_REQUEST['term']))
    exit();
//require_once('connect.php'); connection to db is in this file so connection is not needed
$query =  'SELECT name, SECOND_COLUMNNAME FROM locations 
        WHERE name 
        LIKE ?
        ORDER BY id ASC 
        LIMIT 0,10';
$stmt = $dbh->prepare($query);
$stmt->execute(array(ucfirst($_REQUEST['term']) . '%'));
$data = array();
while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
    $data[] = array(
                'label' => $row['name'],
                'value' => $row['SECOND_COLUMNNAME']
                );
}
echo json_encode($data);
flush();

链接:

http://php.net/manual/en/pdo.prepared-statements.php
http://php.net/manual/en/pdo.connections.php
https://www.owasp.org/index.php/SQL_Injection_Prevention_Cheat_Sheet
How can I prevent SQL injection in PHP?

也不确定connect.php内是否还有其他内容,您可能需要将其恢复。

答案 3 :(得分:0)

<?php
    $data = array(
        'c++',
        'Java',
        'JavScript',"c#" );
echo json_encode($data);
?>

答案 4 :(得分:-1)

所以我想要Pratik Soni的建议并进行搜索。这是PHP代码,如果有人想使用它

<?php
// Connect to server and select databse.
$dblink = mysql_connect('localhost','username','password') or die(mysql_error());
mysql_select_db('DB');
?>

<?php
if(!isset($_REQUEST['term']))
exit();
require('connect.php');
  $term = 
  $query = mysql_query('
SELECT * FROM locations 
WHERE name 
LIKE "'.ucfirst($_REQUEST['term']).'%" 
ORDER BY id ASC 
LIMIT 0,10', $dblink
  );
  $data = array();
  while($row = mysql_fetch_array($query, MYSQL_ASSOC)){
        $data[] = array(
    'label' => $row['name'],
    'value' => $row['name'],
   );   
 }
 echo json_encode($data);
  flush();