2016-05-31 101 views
1

從下面的jQuery代碼我初始化了預輸入插件自動完成僅適用於空間

var users=new Bloodhound({ 

    datumTokenizer:Bloodhound.tokenizers.obj.whitespace('username'), 
    queryTokenizer:Bloodhound.tokenizers.whitespace, 

    remote: { 
     url: 'users.php?query=%QUERY', 
     wildcard: '%QUERY' 
     } 

}); 

users.initialize(); 

$("#SearchCustomer").typeahead({ 
    hint: true, 
    highlight: true, 
    minlength: 2, 



},{ 
    name: 'users', 
    display:'username',  
    source:users.ttAdapter(), 
    templates: { 
     suggestion: function (users) { 
     return '<p><a href="index.php?userid='+users.CustomerId+'" style="color:inherit;text-decoration:none;width:100%">'+users.username+'</a></p>'; 
     } 
    } 

比如我的數據庫是這樣的:

1.Harley
2.Harley戴維森

當我在搜索框中輸入「Har」時,「Harley」僅顯示在建議中。 「Harley Davidson」僅在我在末尾輸入「Harley」時才顯示空格。有人可以建議如何克服這個錯誤?

這是我users.php文件

<?php 

header('Content-Type:application/json'); 

if(!isset($_GET['query'])) 
{ 
echo json_encode([]); 
exit(); 
} 
$mysqli=new PDO("mysql:host=127.0.0.1;dbname=website","root",""); 

$users=$mysqli->prepare("SELECT id,username FROM users WHERE username LIKE   :query"); 

$users->execute(['query'=>"{$_GET['query']}%"]); 

echo json_encode($users->fetchAll()); 
?>  
+0

我們可以在數據庫查詢發生的地方看到users.php代碼嗎?您是否調試過PHP代碼以確保在搜索框中鍵入的內容是查詢中包含的內容? –

+0

@Cᴏʀʏ我修改了這個問題,幷包含users.php文件 – Dilkush

+0

從url返回的數據是什麼樣的?如果您使用像POSTMan這樣的工具來調用url,它是否工作? – whipdancer

回答

0

我複製你的代碼,並添加js文件和作品。讓我告訴我的代碼

的index.php

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <title></title> 
    <link rel="stylesheet" href=""> 
</head> 
<body> 
<input type="text" id="SearchCustomer"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
    <script src="typeahead.js-master/dist/typeahead.bundle.js"></script> 
<script> 
    var users=new Bloodhound({ 

    datumTokenizer:Bloodhound.tokenizers.obj.whitespace('username'), 
    queryTokenizer:Bloodhound.tokenizers.whitespace, 

    remote: { 
     url: 'users.php?query=%QUERY', 
     wildcard: '%QUERY' 
     } 

}); 

users.initialize(); 

$("#SearchCustomer").typeahead({ 
    hint: true, 
    highlight: true, 
    minlength: 2, 



},{ 
    name: 'users', 
    display:'username',  
    source:users.ttAdapter(), 
    templates: { 
     suggestion: function (users) { 
     return '<p><a href="index.php?userid='+users.CustomerId+'" style="color:inherit;text-decoration:none;width:100%">'+users.username+'</a></p>'; 
     } 
    } 
}); 
</script> 

</body> 
</html> 

users.php

<?php 

header('Content-Type:application/json'); 

$users = array(
    array('CustomerId'=> 'example', 'username'=> 'Harley'), 
    array('CustomerId'=> 'another example', 'username'=> 'Harley Davidson') 
); 

echo json_encode($users); 
?> 

我沒有使用的數據基礎,所以有可能從數據庫來的數據與一些未來垃圾。

我希望這可以得到一些幫助。

玩得開心編程!

UPDATE:

我改變users.php,現在JSON沒有垃圾..

<?php 

header('Content-Type:application/json'); 

if(!isset($_GET['query'])) 
{ 
echo json_encode([]); 
exit(); 
} 
$mysqli=new PDO("mysql:host=127.0.0.1;dbname=example","root",""); 

$users=$mysqli->query("SELECT id,username FROM Users WHERE username LIKE '%".$_GET['query']."%'"); 


$array = []; 
while($row = $users->fetch(PDO::FETCH_ASSOC)) { 
    $array[] = $row; 
} 

// echo '<pre>'; 
// print_r($array); 
echo json_encode($array); 

?> 
+0

只是改變「哈利戴維森」到「哈雷戴維森」並檢查代碼...它工作正常與大寫但小寫 – Dilkush

+0

適用於我的大寫或小寫的罰款。 –

+0

感謝哥們。仍然不知道混亂是什麼。 – Dilkush

1

嘗試這樣做你的問題爲每個字的第一個字符將被清除

改變哈雷戴維森哈雷戴維森。對錶中的每個實例重複相同的操作...關於