[英]live search bootstrap with ajax and query
我和一些伙伴一直在嘗試在我們的搜索欄中制作實時搜索腳本。 現在進展不順利,因此我們正在尋求您的幫助!
我們獲取結果的外部文件是這樣的:
$con = mysqli_connect('localhost', '*', '*', '*');
$key=$_POST['search'];
$query = ("select name, url from search where name LIKE '%{$key}%'");
$sql = $con->query($query);
while($row = $sql->fetch_array()){
echo json_encode($row);
}
我們的腳本代碼如下所示:
<script>
$(document).ready(function(){
$( "#formGroupInputLarge" ).keyup(function() {
console.log( "Handler for .keyup() called." )
var string = $('#formGroupInputLarge').val();
$.ajax(
{
type: 'POST',
url: 'search.php',
data: {'search': string},
success: function(data){
var text= JSON.parse(data);
$("#suggesstion-box").show();
$("#suggesstion-box").html("<a href='#'>"+ text +"</a>");
$("#search-box").css("background","#FFF");
}
}
);
});
});
</script>
我們已經嘗試了多種類似下一種的方法:
<script>
$(document).ready(function () {
$("#formGroupInputLarge").keyup(function () {
console.log("Handler for .keyup() called.");
var string = $('#formGroupInputLarge').val();
$.ajax(
{
type: 'POST',
url: 'search.php',
data: {'search': string},
success: function (data) {
var obj = eval('('+ data +')' );
console.log(obj['name']);
//var text = JSON.parse(data);
//$("#suggesstion-box").show();
//$("#suggesstion-box").html(text);
//$("#search-box").css("background", "#FFF");
}
}
);
});
});
</script>
但似乎都不起作用。 請幫助我們!
您的代碼中可能有很多錯誤! 您需要提供有關每個部分的行為(錯誤消息等)的更多信息。
選中此項可以很好地了解AJAX的所有功能,以及簡單易用的示例http://www.w3schools.com/php/php_ajax_intro.asp
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.