4

従来のid、label、valueを使用せずにJQueryオートコンプリートを機能させることは可能ですか？

たとえば、私は使用したくありません：

[ { "id": "Botaurus stellaris", "label": "Great Bittern", "value": "Great Bittern" }, 
{ "id": "Asio flammeus", "label": "Short-eared Owl", "value": "Short-eared Owl" }]

むしろ：

[ { "my_id": "Botaurus stellaris", "first_name": "Great Bittern", "last_name": "Great Bittern" }, 
{ "my_id": "Asio flammeus", "first_name": "Short-eared Owl", "last_name": "Short-eared Owl" }]

つまり、JQuery autocomplete通常は何が必要なのか、Jqueryオートコンプリートを同じように処理するようid,value,labelにできますか？my_id, first_name, last_nameid,label,value

これは、データソースからのデータのキーを変更したくない場合に、JQueryオートコンプリートに表示するのに役立つ場合があります。

4

2 に答える 2

2

どうでも、

JQueryUI のオートコンプリート サンプル ソースから答えを見つけました。

    $( "#city" ).autocomplete({
        source: function( request, response ) {
            $.ajax({
                url: "http://ws.geonames.org/searchJSON",
                dataType: "jsonp",
                data: {
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    name_startsWith: request.term
                },
                success: function( data ) {
                    response( $.map( data.geonames, function( item ) {
                        return {
                            label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
                            value: item.name
                        }
                    }));
                }
            });
        },
        minLength: 2
    });

ここでsourceは、任意のタイプのキーを変換して返すことができる関数が割り当てられており、JQuery の Autocomplete のid,value,label.

それはいくつかを助けるかもしれません。

于 2012-07-07T14:50:27.133 に答える
1

さらに良い解決策があります。jquery-ui Web サイトにも文書化されています。

http://jqueryui.com/demos/autocomplete/#custom-data

$("input").autocomplete({..})
.data( "autocomplete" )._renderItem = function( ul, item ) {return $( "<li></li>" )
    .data( "item.autocomplete", item )
            .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
            .appendTo( ul );
    };
于 2012-08-23T09:58:45.763 に答える