帶有ajax的實時搜索引導和查詢

我和一些伴侶一直在試圖在搜索欄上創建實時搜索腳本。現在情況不太好，所以現在我們要求你的幫助！帶有ajax的實時搜索引導和查詢

我們的外部文件來得到的結果是這樣的：

$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>

但似乎沒有任何工作。請幫助我們！

來源

2015-10-06 kkev30

是如何工作的一個很好看'沒有它似乎work'是不是一個合理的問題陳述。你在這裏有多個圖層... dom事件，ajax發送...服務器處理... ajax接收...需要縮小這個範圍。內置的瀏覽器開發工具是您需要啓動的地方。至少要確定是否有人提出要求 – charlietfl

@charlietfl你可以拍攝一個好方向嗎？我們嘗試谷歌和學習了關於jQuery/ajax回合，但它很難學習（這是我們的意見） – kkev30

我做了...在瀏覽器開發工具網絡（F12），看看是否正在提出請求...也檢查控制檯錯誤。閱讀控制檯的工作原理......這是您排除故障的第一行。需要縮小鏈的哪個部分被破壞 – charlietfl

在您的代碼中可能會出現很多錯誤！您需要提供更多關於每個零件行爲的信息（錯誤消息等）。

選中此得到的一切與AJAX，以及很好的和簡單的例子http://www.w3schools.com/php/php_ajax_intro.asp

來源

2015-10-06 18:03:27 Flo

謝謝，我們將嘗試學習更多關於ajax的知識，如果它不能解決問題，我們將提供更好的腳本！ – kkev30

NP！努力工作，努力工作！而不是使用 '$ con = mysqli_connect（'localhost'，'*'，'*'，'*'）;' 看看PDO對象 http://wiki.hashphp.org/PDO_Tutorial_for_MySQL_Developers http://www.phpro.org/tutorials/Introduction-to-PHP-PDO.html#4.3 – Flo

我通常在我的代碼中使用PDO作爲個人意見。但由於該組投票mysqli我沒有真正有選擇：P，但我會告訴他們的鏈接！也許它會改變那裏的意見！ – kkev30

帶有ajax的實時搜索引導和查詢

回答

相關問題