1
我越來越有devbridge autocomplete麻煩在我的形式devbridge自動完成查詢AJAX實現
我頭部分:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="/autocomplete/jquery.autocomplete.min.js"></script>
輸入字段頁面看起來是這樣的:
<script>
$('#client_recommendation').autocomplete({
serviceUrl: '/autocomplete/ClientRecommendation.php',
onSelect: function (suggestion) {
alert('You selected: ' + suggestion.value + ', ' + suggestion.data);
}
});
</script>
<form action="/scripts/add_client.php" method="post" name="add_client">
<fieldset>
<label for="client_recommendation">Recommendation:</label>
<input name="client_recommendation" size="25" type="text" id="client_recommendation" />
</fieldset>
</form>
ClientRecommendation.php
require '../scripts/connect.php';
$cr = trim($_GET['client_recommendation']); //also tried trim($_GET['query']);
$sql = "SELECT client_name, client_id
FROM (
SELECT CONCAT(
client_name, ' ', client_surname, IF(
LENGTH(client_prompt),
CONCAT(' (',client_prompt,')'), '')
)
AS client_name, client_id
FROM `clients`
)
clients
WHERE client_name LIKE '%" . $cr . "%'
ORDER BY client_name";
$result = $conn->query($sql);
$reply = array();
$reply['query'] = $cr;
$reply['suggestions'] = array();
while($row = $result->fetch_assoc()) {
$reply['suggestions'][]=$row['client_name'];
}
echo json_encode($reply);
$conn->close();
作爲測試我想這:
$cr = "pa";
和ClientRecommendation.php
返回正確的結果:
{"query":"pa","suggestions":["Pavlo hryhorash"]}
這是有效的JSON,但在我的形式,我什麼也沒得到。 任何幫助,將不勝感激
UPDATE
我加$(document).ready
到腳本的頁面輸入字段:
<script>
$(document).ready(function(){
$('#client_recommendation').autocomplete({
serviceUrl: '/autocomplete/ClientRecommendation.php',
onSelect: function (suggestion) {
alert('You selected: ' + suggestion.value);
}
});
});
</script>
後所生成的HTML標記的建議開始與頁面加載,並在輸入字段中鍵入時,我在控制檯中看到此錯誤:
Uncaught SyntaxError: Unexpected token <
m.parseJSON @ jquery.min.js:4g.transformResult @
jquery.autocomplete.min.js:49(anonymous function) @
jquery.autocomplete.min.js:288j @ jquery.min.js:2k.fireWith @ jquery.min.js:2x @
jquery.min.js:4b @ jquery.min.js:4