javascript - 从数据库填充数据时,Jquery token 输入不起作用

标签 javascript php jquery jquery-tokeninput

我正在尝试使用 jquery token 输入插件 http://loopj.com/jquery-tokeninput/ 从数据库填充数据.但什么也没有出现。我想知道我哪里出错了。

我接受任何替代方法

我搜索的每个示例似乎都不起作用。

我的索引页

<script type="text/javascript" 
        src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js">
</script>
<script type="text/javascript" src="src/jquery.tokeninput.js"></script>

<link rel="stylesheet" href="styles/token-input.css" type="text/css" />
<link rel="stylesheet" href="styles/token-input-facebook.css" type="text/css" />
<div>
<input type="text" id="tagcool"   name="blah" />
<input type="button" value="Submit" />       
<script type="text/javascript">
$(document).ready(function() {                                  
   $("#tagcool").tokenInput("phpsearch.php", {
   theme: "facebook",
   preventDuplicates: true,              
});

});
</script>

还有我的 PHP 页面

    <?php
$link = mysqli_connect("localhost","root","","dbname") or die("Couldn't make connection.");

$look = $_GET['q']; 
$arr = array();
$rs = mysqli_query($link,"SELECT * FROM `country` WHERE name like '%".$look."%'");
# Collect the results
while($obj = mysqli_fetch_object($rs)) {
    $arr[] = $obj;
}
# JSON-encode the response
$json_response = json_encode($arr);
# Optionally: Wrap the response in a callback function for JSONP cross-domain support
if($_GET["callback"]) {
    $json_response = $_GET["callback"] . "(" . $json_response . ")";
}
# Return the response
echo $json_response;

?>

我的数据库示例

enter image description here

最佳答案

这有效。您需要根据您的设置更改下面的一些编码。

HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles/token-input-facebook.css" type="text/css" />
</head>
<body>
<form name='jqueryAutocompleteForm' id='jqueryAutocompleteForm'>
    <label for='query'>Search:</label>
    <input type='text' name='q' class='form-control input-lg' id='query' placeholder='Please Start Typing'>
    <input type='submit' value='Submit' class='btn btn-info'>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script type="text/javascript" src="src/jquery.tokeninput.js"></script> 
<script type="text/javascript">
        $(document).ready(function() {
            $("#query").tokenInput("php.php", {
                theme: "facebook"
            });
        });
        </script>
</body>
</html>

注意:确保“jquery.tokeninput.js”和“php to json”的路径(在我的例子中为“php.php”和你的“phpsearch.php”)是正确的。

php.php

<?php

    //open connection to mysql db
    $connection = mysqli_connect("localhost","root","","tags") or die("Error " . mysqli_error($connection));


    $s = $_GET["q"];
    //fetch table rows from mysql db
    $sql = "SELECT name from mytable WHERE name LIKE '%".$s."%'";
    $result = mysqli_query($connection, $sql) or die("Error in Selecting " . mysqli_error($connection));

    //create an array
    $emparray = array();
    while($row =mysqli_fetch_assoc($result))
    {
        $emparray[] = $row;
    }
    echo json_encode($emparray);

    //close the db connection
    mysqli_close($connection);


?>

替换选择查询,“$sql = "SELECT name from mytable WHERE name LIKE '%".$s."%'";"与你的。

如果您需要知道,我的数据库只有 1 个表,其中有 2 列 1.id、2、name。

关于javascript - 从数据库填充数据时,Jquery token 输入不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38422209/

相关文章:

javascript - 图像和按钮的悬停效果

javascript - 如何在保持相对于另一个 Div 的同时将 HTML 附加到正文

Javascript 过滤功能无法正常工作

php - 为 thunderbird/Outlook/准备电子邮件

php - 如何将新的索引和值推送到 php 数组?

php - 如何使用 php 将选定复选框中的值保存到文件中?

jquery - 队列任务 jQuery

javascript - 使用 yepnope 进行响应式设计脚本处理

javascript - 如何将幻灯片范围插入mysql?

javascript - 仅在移动设备上输入整数