33

以下のコードを使用してオートコンプリートを実装しようとすると、次のエラーが表示されます。

.data("autocomplete") is undefined

ただし、最後から .data() メソッドを削除すると、正常に動作します (.data() が提供するカスタマイズ可能なグラフィックがなくても)。誰が何が問題なのか教えてもらえますか?

$("input#testInput").bind("autocompleteselect", function (event, ui) {

  }).autocomplete({
      appendTo: "#autoCompList",
      source: function (request, response) {
          $.ajax({

              url: JSONP CALL URL
              dataType: "jsonp",
              data: {
                  featureClass: "P",
                  style: "full",
                  maxRows: 12,
                  name_startsWith: request.term
              },
              success: function (data) {
                  response($.map(data.data, function (item) {
                      fbPageJson = item;
                          return {
                              label: item.name,
                              image: item.picture,
                              json: item,
                          }
                  }));
              },
          });
      }

  }).data("autocomplete")._renderItem = function (ul, item) {
      return $("<li></li>").data("item.autocomplete", item).append("<a><img src='" + item.image + "' alt='no photo'/></a>" + item.label).appendTo(ul);
  };
4

6 に答える 6

60

私は同じ問題を抱えていましたが、1.10.0バージョンのjquery uiに基づいて、試してみるべきだと思います

data('uiAutocomplete')

それ以外の

data('autocomplete')

Johnnyのコメントに基づいて、.data（）関数がどのように機能するかを確認しました。はい、セレクターがアイテムを見つけられない場合、jQueryは.data（）呼び出しからnullを返します。

したがって、セレクターに一致する要素がない場合、オートコンプリートオブジェクトは作成されず、カスタムデータオブジェクトに追加されません。

したがって、これを行う方が良いようです。

    $(selector).autocomplete({ your autocomplete config props here });
    if ( $(selector).data() ) {

    // some jQueryUI versions may use different keys for the object. so to make sure,
    // put a breakpoint on the following line and add a watch for $(selector).data(). 
    // then you can find out what key is used by your jQueryUI script.

        var ac = $(selector).data('uiAutocomplete');
        if ( ac ) {
           // do what you want with the autoComplete object. below is the changed version of an example from jqueryUI autocomplete tutorial

           ac._renderItem = function(ul, item) {
                return $("<li>")
                    .append("<a>" + item.label + "</a>")
                    .appendTo(ul);
            };
        }
    }
于 2013-01-22T22:07:58.853 に答える
8

data('ui-Autocomplete')私の悩みを解決しました。jquery 1.7からだと思いますjquery-ui 1.8。data('autocomplete')大丈夫でした。これらのファイルの最近のバージョンを使用した同じスクリプトは機能しません。

于 2013-03-03T00:03:57.207 に答える
4

response実際、成功関数では、次のようなオブジェクトを呼び出して返します。

return {
           label: item.name,
           image: item.picture,
           json: item,
       }

しかし、次の行で

return $("<li></li>").data("item.autocomplete", item).append("<a><img src='" + item.image + "' alt='no photo'/></a>" + item.label + " Number of Likes: " + item.likes).appendTo(ul);

item.likes返されたオブジェクトでは使用できないものを使用しているため、問題が発生します。私はあなたがそれを次のように使うことができると思います

success:function(data) {
    var result = $.map(data, function (item){
    return {
            label: item.name,
            image: item.picture,
            item.likes 
        };
    });
    response(result);
}

また、item.label内部を保持し<a></a>ます（エラーの原因ではない可能性があります）。

return $("<li></li>").data("item.autocomplete", item).append("<a><img src='" + item.image + "' alt='no photo'/>"+item.label+"</a>").appendTo(ul);

次の行で確認してください

$.map(data.data, function (item) // notice data.data

あるべきか、data.dataそれともdata。json: item私の知る限り、どこでも使用しなかったため、オブジェクトからを削除することもできます。

更新：次の行を変更します

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

に

.data("autocomplete")?._renderItem = function (ul, item) {...}; // notice the ? mark

また

if(typeof $('#Your_Input_Id').val()!="undefined")
{
    $('#Your_Input_Id').autocomplete({....});
}

また

var mydata=$('#Your_Input_Id').autocomplete(...).data('autocomplete');
if(mydata)
    mydata._renderItem = function (ul, item) {...};
于 2012-09-05T18:23:14.163 に答える
1

サイトのデモでコンボボックスの最新の例を見ると、データ（'ui-Autocomplete'）を使用していることがわかります。私はあなたと同じ問題に遭遇しました。以前はjquery-1.6.2とjquery-ui-1.8.16を使用していました。ファイルをjquery-1.9.1およびjquery-ui-1.10.0に更新すると、エラーが修正されました。古いjquery-uiオートコンプリートはdata（'ui-Autocomplete'）プロパティを設定していなかったと思います。したがって、取得時にnull/未定義でした。あなたはおそらくすでに問題を修正しているので、これが他の人々に役立つことを願っています。

于 2013-02-07T17:38:37.937 に答える
0

以下の行を実装できます

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

の状態

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

JqueryサイトのJquery AutoComplete Documentation and exampleで入手可能なドキュメントに従って、 このコードが見つかります。

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

于 2015-09-15T07:58:32.440 に答える