0

私はこれを機能させるためにあまりにも長い間これをいじっています。ポインタがあるかどうか、誰でも確認できますか。

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link type="text/css" rel="stylesheet" href="autocomplete.css" />      
        <script src="jquery-1.7.2.min.js" type="text/javascript"></script>
        <script src="jquery-ui-1.8.21.custom.min.js" type="text/javascript"></script>
        <title></title>
    </head>
    <body>
        <style>
            .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
        </style>
        <script>
            $(function() {                
                $( "#materials" ).autocomplete({
                    source: "autocomplete.php",
                    minLength: 2
                });
            });
        </script>
        <div class="demo">

            <div class="ui-widget">
                <label for="materials">Materials: </label>
                <input id="materials" />
            </div>
        </div><!-- End demo -->            
    </body>
</html>

そしてphpファイルは

require_once "db_con.php"; // Database connection, I know this works.
$q = strtolower($_GET["q"]);
if (!$q)
    return;

$sql = "SELECT * FROM materials WHERE name LIKE '%$q%'"; 
$rsd = mysqli_query($dbc, $sql) or die(mysqli_error($dbc));
while ($rs = mysqli_fetch_array($rsd)) {
    $cname = $rs['name']; // I know this all returns correctly
    echo json_encode($cname); // First time I have ever used json, error might be here.
}

PHPを使用してmysqlからデータが提供されるJqueryを利用したオートコンプリートを備えたWebページを作成しようとしています。シンプル。機能していないだけです...

私が見逃しているものは誰にもありますか？

よろしく

- - 編集 - -

これが機能していることを確認するために、次のことを完了しました。

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link type="text/css" rel="stylesheet" href="autocomplete.css" />      
        <script src="jquery-1.7.2.min.js" type="text/javascript"></script>
        <script src="jquery-ui-1.8.21.custom.min.js" type="text/javascript"></script>
        <title></title>
    </head>
    <body>
        <style>
            .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
        </style>
        <script>
            $(function() {                
                $( "#materials" ).autocomplete({
                    source: <?php
include_once 'db_con.php';
$sql = "SELECT name FROM materials";
$rsd = mysqli_query($dbc, $sql) or die(mysqli_error($dbc));
echo '[';
while ($rs = mysqli_fetch_array($rsd)) {
    echo "'" . $rs['name'] . "', "; //add results to array
}
echo ']';
?>,
                        minLength: 2
                    });
                });
        </script>
        <div class="demo">

            <div class="ui-widget">
                <label for="materials">Materials: </label>
                <input id="materials" />
            </div>


        </div><!-- End demo -->        
    </body>
</html>

これは完璧に機能します。事実、私はこのコードを本来の動作方法とは異なるままにしておくつもりだと思いますが...

4

4 に答える 4

1

このコードを試してみてください、それは私のために働きます

$().ready(function() {
$("#materials").autocomplete("autocomplete.php", {
        width: 260,
        matchContains: true,
        autoFill:true,
        selectFirst: false
    });
});
于 2012-07-19T08:48:52.657 に答える
1

PHP の部分では、次のようなことを試してみてください。

$res = array();  //create a new array
while ($rs = mysqli_fetch_array($rsd)) {
  $res[] = (string)$rs['name']; //add results to array, casted as string
}
header('Content-type: application/json'); //add JSON headers (might work w/o)
echo json_encode($res);  //output array as JSON

...そのようにして、すべての結果を次のような1つの配列にする必要があります ['name1', 'name2', 'name3']

于 2012-07-19T08:46:24.470 に答える
0

あなたのPHPはすべて間違っています:

while ($rs = mysqli_fetch_array($rsd)) {
    $cname = $rs['name']; // I know this all returns correctly
    echo json_encode($cname); // First time I have ever used json, error might be here.
}

次のようにする必要があります。

$cname = array();
while ($rs = mysqli_fetch_array($rsd)) {
    $cname[]['label'] = $rs['name']; // I know this all returns correctly
    break;
}
echo json_encode($cname); // First time I have ever used json, error might be here.

labeljqueryautocomplete で使用される配列行内のデフォルトのラベル フィールドです (私は信じています)。また、戻り値は、各配列行が一致を表す配列の配列でなければなりません。

次のようにして、テキストボックスを実際に等しくする値のフィールドを追加することで、より複雑にすることができます。

$cname = array();
while ($rs = mysqli_fetch_array($rsd)) {
    $cname[]['label'] = $rs['name']; // I know this all returns correctly
    $cname[]['value'] = $rs['id'];
    break;
}
echo json_encode($cname); // First time I have ever used json, error might be here.

もちろん、あなたが実際break;にこれを入れたいと思っているとは思いません。理由は次のとおりです。

while ($rs = mysqli_fetch_array($rsd)) {
    $cname = $rs['name']; // I know this all returns correctly
    echo json_encode($cname); // First time I have ever used json, error might be here.
}

結果から実際に単一の行を返していることを私に示します。そうではなく、実際にすべての結果を返している場合は、削除しbreak;てください。

于 2012-07-19T09:13:08.290 に答える
0

php ajax呼び出しからのjson回答を処理するには、ソース関数をカスタマイズし、結果を次のように処理します:

$(function() {                
    $( "#materials" ).autocomplete({
        source: function(request, response){
            $.post("autocomplete.php", {
                term: request.term
            }, function(data){
                if (data.length == 0) {
                    data.push({
                        label: "No result found",
                    });
                }
                response($.map(data, function(item){
                    return {
                        label: item.name,
                        value: item.name
                    }
                }))
            }, "json");
        },
        minLength: 2,
        dataType : "json"});
});
于 2012-07-19T09:00:53.257 に答える