9

ページでオートコンプリートを機能させるのに非常に問題があります。検索入力に 2 文字 (「OW」) を入力すると、プリローダー イメージ (以下を参照) が表示されますが、消えることはなく、オートコンプリート ポップアップも表示されません。Chrome でコンソールを見ると、次のように表示されます。

Uncaught TypeError: Cannot use 'in' operator to search for '62' in [{"value":103,"label":"FLOWER"},{"value":105,"label":"YELLOW"}]

返される実際の文字列は次のとおりです (成功ブロックにアラート (データ) を追加することで確認できます)。

[{"kwrdID":103,"kwrdKeyWord":"FLOWER"},{"kwrdID":105,"kwrdKeyWord":"YELLOW"}]

これがオートコンプリートのメインコードです

$("#searchInput").autocomplete({
source: function (request, response) {
    $.ajax({
        url: '@Url.Action("GetKeywords", "Home")',
        dataType: "json",
        data: {
            SearchTerm: request.term
        },
        success: function (data) {
            response($.map(data.keywords, function (item) {
                return {
                    label: item.kwrdKeyWord,
                    value: item.kwrdID
                }
            }));
        }
    });
},
    minLength: 2
});

そして最後に、これがプリローダーです (関連がある場合に備えて)。

$(document).ajaxStart(function () {
    var position = $('#divParent').position();
    position.left += (($('#divParent').width() / 2) - ($('#preloader').width() / 2));
    position.top += (($('#divParent').height() / 2) - ($('#preloader').height() / 2));
    $('#preloader').css(position).show();
    $('#preloader').show();
}).ajaxStop(function () {
    $('#preloader').hide();
});

ここで何が起こっているのかを説明できる人はいますか?

4

4 に答える 4

14

長い道のりでしたが、何時間も実験を重ねた結果、次のコードにたどり着きました。

$("#searchInput").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: '@Url.Action("GetKeywords", "Home")',
            dataType: "json",
            data: {
                SearchTerm: request.term
            },
            success: function (data) {
                var parsed = JSON.parse(data);
                var newArray = new Array(parsed.length);
                var i = 0;

                parsed.forEach(function (entry) {
                    var newObject = {
                        label: entry.kwrdKeyWord
                    };
                    newArray[i] = newObject;
                    i++;
                });

                response(newArray);
            },
            error: function (message) {
                response([]);
            }
        });
    },
    minLength: 2
});

これはうまくいくようです。実は、私のキーワードはユニークなので、とにかく ID がなくても生きていけるのです。

于 2013-02-20T17:52:34.973 に答える
9

役に立つかもしれないちょっとした助け：

jsonを使用している場合、「jsonオブジェクト」が解析されていないか、変数を他の文字列で上書きした可能性があります(最近愚かなことをしたように)。

最初の問題については、サーバーが "application/json" MIME タイプを認識していることを確認してください。それ以外の場合はヘッダーを使用します (PHP の場合)。

つまり、PHPでは、これをすべての前に使用します。

header("Content-type: application/json");
于 2014-01-28T13:29:38.907 に答える