0

Chromeデベロッパーツールからの応答を見ると、次のように表示されます。

[{
"summary": "foo",
"key": "myKey"
}]

私のjavascript(更新):

jquery183(function() { 
jquery183( "#city" ).autocomplete({
    source: function( request, response ) {
        jquery183.ajax({
            url: '/servlet/ajax/',
            dataType: "jsonp",
            data: {
                featureClass: "P",
                style: "full",
                maxRows: 12,
                name_startsWith: request.term
            },
            success: function( data ) {
                response( jquery183.map( data, function( issue ) {
                    return {
                        label: issue.summary + ", " + issue.key,
                        value: issue.summary
                    }
                }));
            }
        });
    },
    minLength: 2,
    open: function() {
        jquery183( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
    },
    close: function() {
        jquery183( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
    }
});

});

HTML:

 <div class="ui-widget">
    <label for="city">Your city: </label>
    <input id="city" />
    Powered by <a href="http://geonames.org">geonames.org</a>
 </div>

これでうまくいくと思いましたが、オートコンプリート項目を示唆していません。助言がありますか?

さらにコードが必要な場合は、お気軽にお問い合わせください。

4

3 に答える 3

1

で見られるように:http://jqueryui.com/autocomplete/#remote-jsonp

データを取得するためにajax呼び出しをコピーして貼り付けるのを忘れました。

$( "#city" ).autocomplete({
      source: function( request, response ) {
        $.ajax({
          url: "http://ws.geonames.org/searchJSON",
          dataType: "jsonp",
          success: function( data ) {
            response( $.map( data.geonames, function( item ) {
              return {
                label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
                value: item.name
              }
            }));
          }
        });
      }
});
于 2013-01-09T13:02:13.690 に答える
0

よくわかりませんが、に問題があり<input id="city" />ます。おそらく<input id="city" type="text"/>

于 2013-01-09T12:57:15.140 に答える
0

ここから答えが見つかりました:

Ajax成功イベントが機能しない

結果はおそらくJSON形式ではないため、jQueryがそのように解析しようとすると、失敗します。エラーでエラーをキャッチできます:コールバック関数。

とにかくその関数にJSONは必要ないようですので、dataType:'json'行を取り出すこともできます。

于 2013-01-10T07:23:04.033 に答える