0

サーバーからjqueryを介してソースデータ全体をロードしたいのですが、ページロード時に1回だけロードします。変数に格納したい。jquery部分は機能しますが、入力はオートコンプリートされません。何もしません。ソースがソースのように記述されている場合にのみ機能します：["blablabla"、"dadadada"]。

これは私のJavascriptコードです：

var datasource;          // this is the variable where my source will be stored

$.post("typeahead.php",
  {
    query: 'query'       // 'query' has no meaning ;)
  }, 
  function(data) {       // data looks like ["asd","fds"] thanks to json_encode on the server side
    datasource = data;
});

$('#searchInput').typeahead( {
  source: datasource
});

サーバーサイドのphpコード：

    /* connect to the db */
    $con = mysql_connect("localhost","fahrschulesql1","******");
    if (!$con)
    {
        die('Could not connect: ' . mysql_error());
    }
    // Select Database
    $db_selected = mysql_select_db("fahrschulesql1", $con);
    if (!$db_selected) {
        die ("Select DB error: " . mysql_error());
    }
    $query = "SELECT Vorname, Nachname FROM Benutzer b, Fahrlehrer f WHERE b.BenutzerID = f.BenutzerID";
    $result = mysql_query($query) or die ("MySQL-Error: " . mysql_error());
    while($row = mysql_fetch_array($result)){
        $array[] = $row["Vorname"] . " " . $row["Nachname"]; 
    }
    echo json_encode($array);
    mysql_close($con);

私は何が間違っているのですか？

4

2 に答える 2

3

datasource新しい配列を割り当てることにより、配列への参照が失われます。配列への参照が失われないように、配列を操作する必要があります。

var datasource = [];

$.post("typeahead.php", {
    query: 'query'
}, function(data) {
    /* Add the responses to the datasource, don't mess up the reference */
    [].push.apply(datasource, data);
});

$('#searchInput').typeahead({
    source: datasource
});

こちらをご覧ください。

もう1つのオプションは、応答をキャッシュすることです。私は個人的に前の方法よりもこの方法を好みます。

process最初のリクエストを送信した後にコールバックを使用して、データをキャッシュできます。以降、キャッシュされたデータを使用します。

var cachedsource = (function(){
    var datasource = null;
    return function(query, process){
        if(datasource !== null) {
            /* use cached data */
            return datasource;
        } else {
            $.post("typeahead.php", {
                query: 'query'
            }, function(data) {
                /* cache data */
                datasource = data;
                process(datasource);
            });
        }
    };
})();


$('#searchInput').typeahead({
    source: cachedsource
});

こちらをご覧ください。

PHPが正しくないを返していContent-Typeます。$.ajaxの代わりに試してください$.post。

$.ajax({
  url: "typeahead.php", 
  data: {
    query: 'query'
  },
  success: function(data) {
    /* cache data */
    datasource = data;
    process(datasource);
  },
  dataType: "json"
});

dataTypeがに設定されていることに注意してくださいjson。

Content-Typeを使用して、PHPで正しい設定を行うこともできますheader()。

header('Content-Type: application/json');
echo json_encode($array);
于 2012-12-27T00:16:04.673 に答える
0

あなたのhtmlコードはどこにありますか？

これを使用していますか：

<input id="searchInput" type="text" data-provide="typeahead">

？

次に、Firebugでコールバックが正常であり、データが返されることを確認します。たとえば、ここでURLを指定しなかったためです。

$.post("typeahead.php",

次に、document.ready内でjsを実行していることを確認してください

$(document).ready(function(){

//do my js
});

また試してみてください：

console.log(datasource);その変数をブートストラッププラグインに渡す前に

間違いなくこれを試してください：

$(function(){

$.post("typeahead.php",
  {
    query: 'query'       // 'query' has no meaning ;)
  }, 
  function(data) {       // data looks like ["asd","fds"] thanks to json_encode on the server side
    $('#searchInput').typeahead( {
  source: data
});
});

});
于 2012-12-26T23:47:42.043 に答える