5

JQuery 1.8.3 と JQuery UI 1.8.24 を使用しています。

これは問題なく動作するコードです:



    $(function () {
        $("#").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: '', type: "POST", dataType: "json",
                    data: { searchPattern: request.term },
                    cache: false,
                    success: function (data) {
                        response($.map(data, function (item) {
                            return { label: item.Label, value: item.Value, id: item.Id, description: item.Description }
                        }))
                    }
                });
            },
            delay: 300,
            minLength: 2,
            autoFocus: true
        })
        .data("autocomplete")._renderItem = function (ul, item) {
            return $("li>/li>")
            .data("ui-autocomplete-item", item)
            .append("a>" + item.label + "br>div style=\"font-size:x-small;font-style:italic;\">" + item.description + "/div>/a>")
            .appendTo(ul);
        };
    });

しかし、HTML に 2 番目のテキスト ボックスを追加し、上記の JavaScript をコピーしてセレクターと URL を変更すると (最終的に 2 つのオートコンプリート テキスト ボックスができます)、2 番目のオートコンプリートで次のエラーが発生します。

TypeError: $(...).autocomplete(...).data(...) is undefined

1 つのオートコンプリートでは完璧に機能しますが、2 番目のオートコンプリートでは理由を説明できません。誰でも私を助けることができますか?

前もって感謝します!

トビー

編集:

問題が見つかりました。

JavaScript コードは *.js ファイルにあり、2 つのテキスト ボックスは 2 つの異なる *.thml ファイルにあります。

したがって、一度に 1 つのテキスト ボックスしかなく、これが問題です。

*.html ファイルの最後の部分 (data(...) を使用) を実行すると、正常に動作します。

$("#selector").autocomplete().data("autocomplete")._renderItem = renderItem;

お手伝いありがとうございます!

4

3 に答える 3

0

以下の行を実装できます

.autocomplete( "インスタンス" )._renderItem = function( ul, item ) {

の状態

.data("autocomplete")._renderItem = function (ul, item) {

Jquery サイトのJQuery AutoComplete Funtionalityで入手可能なドキュメントに従って、このコードを見つけることができます。

jquery 1.10 のアップグレードされたバージョンから、コードが変更されました。これがあなたを助けることを願っています。

于 2015-09-15T07:55:08.807 に答える