如何在Bootstrap typeahead中使用我使用MySQLi從數據庫中獲得的數據？

我正在使用jQuery ajax + MySQLi的準備語句從我的數據庫中獲取數據。問題是我不知道如何精確地格式化Bootstrap的typeahead插件中使用的數據。如何在Bootstrap typeahead中使用我使用MySQLi從數據庫中獲得的數據？

這是相關代碼：

PHP：

$stmt = $mysqli->prepare("SELECT GAME_NAME FROM GAMES WHERE GAME_NAME LIKE ?"); 
     $query = "%".$query."%"; 
     $stmt->bind_param('s',$query); 
     $stmt->execute(); 
     $stmt->store_result(); 
     $count = $stmt->num_rows; 

     if($count > 0) { 

      $stmt->bind_result($result); 
      while($stmt->fetch()) { 

      echo json_encode($result); 
      }

我得到的AJAX響應什麼是所有的名字爲一串文字：

'"game 1""game 2""blaablaa""some other game"....'

我想我必須有一個名稱陣列，我不知道如何將stmt結果作爲一個數組。我嘗試和作品的例子是（我使用數組allCities作爲數據源）：

<script type="text/javascript"> 
     $(document).ready(function() { 
      var allCities = ['Baltimore', 'Boston', 'New York', 'Tampa Bay', 'Toronto', 'Chicago', 'Cleveland', 'Detroit', 'Kansas City', 'Minnesota', 'Los Angeles', 'Oakland', 'Seattle', 'Texas'].sort(); 
      $('#city').typeahead({source: allCities, items:5}); 
     }); 
    </script>

現在，如果我只能拿到導致相同的格式，在本例中，我的問題應該解決了，我想。順便說一句，我不知道我在代碼中使用的json_encode()。這只是我試了一下。我感謝任何幫助。謝謝。

UPDATE，阿賈克斯：

function handleSearch() { 

    var query = $.trim($('#search-field').val()); 
    var itm = getSearchItem(); 

    $.ajax({ 

     type: "POST", 
     url: "..//functions/handleSearch.php", 
     dataType: "json", 
     data: "query="+query+"&itm="+itm, 
     success: function(resp) { 

      console.log("Server said (response):\n '" + resp + "'"); 

      $('#search-field').typeahead({source: resp}); 


     }, 

     error: function(e) { 
      console.log("Server said (error):\n '" + e + "'"); 
     } 
    });

另一個更新：

在網絡選項卡中的反應讓我想要的結果，但這種格式：Resistance: Fall of ManResident Evil 4John Woo Presents StrangleholdAge of Empires II: The Age of KingsResident Evil 2。所以沒有任何格式。 Console.log(resp)雖然沒有給我。雖然當我搜索「生化危機6」時，這意味着當我輸入精確姓名時，console.log也可以工作。

來源

2012-05-27 Loolooii

基本上你應該創建key => value store數組，然後最後你應該用json_encode輸出它。你在代碼中做錯了什麼，你正試圖對每個結果進行echo和json_encode，而這些結果應該在最後完成。

來源

2012-05-27 19:54:43 Dharmavir

發佈初始化ajax請求的代碼。

例如，這是速記的jQuery AJAX功能

$.ajax({ 
    url: url, 
    dataType: 'json', 
    data: data, 
    success: callback 
});

如果數據類型指定JSON然後回調函數會收到這樣在你的榜樣allCities一個數組，那麼你可以將它傳遞給你的插件。例如：僞代碼：

$.ajax({ 
    url: 'http://blabla', 
    dataType: 'json', 
    data: dataArray, 
    success: function(response) { 
    $('#city').typeahead({source: response, items:response.count()}); 
    } 
});

來源

2012-05-27 18:14:18

我剛剛用dataType修改了代碼：'json'，我得到Server說的（錯誤）： '[object Object]'。當然這個消息不是很有幫助。 – Loolooii

當服務器響應不是json格式時，可能會發生這種錯誤。你能發佈一些關於請求的信息嗎？標題和原始格式的響應 –

John，你能看到我對我的問題的最新更新。謝謝。 – Loolooii

如何在Bootstrap typeahead中使用我使用MySQLi從數據庫中獲得的數據？

回答

相關問題