2016-07-17 40 views
0

我试图用jquery token-input插件从数据库填充数据http://loopj.com/jquery-tokeninput/但是没有显示出来。我想知道我错在哪里。从数据库填充数据时Jquery token-input无法正常工作

我接受任何替代方法

每一个例子,我搜索似乎并没有工作。

我的索引页

<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

+0

首先删除插件选项中的额外逗号(不是答案)并解释更多什么是不工作的,控制台上有什么和更多的调试信息 – vinayakj

+0

它不返回任何错误或结果。只是说搜索... –

+0

什么在网络选项卡,ajax状态显示什么?你可以创建一个jsfiddle吗? – vinayakj

回答

2

This Works。根据您的设置,您需要更改下面的一些编码。

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以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 = “从MYTABLE SELECT name其中name LIKE“%” $ S。“%' ”;“与你的。

如果您需要知道,我的数据库只有1个表,2列1.id,2,名称。