1

私たちは旅行ウェブアプリを開発しています。これは空港コードのオートコンプリートを使用したシナリオですが、意図したとおりに機能させるのに苦労しています。xmlからすべての空港コードと都市名を取得し、テキスト入力にバインドしています。シナリオは、ユーザーが「マニ」と入力した場合、 「すべての都市はマニで始まる」と表示されるはずです。代わりに、その用語のマニを含むすべての都市が表示されます（この画像を参照：http：//imgur.com/61WS6）。ただし、ユーザーが空港コードを直接入力すると、明らかに結果が表示されます。

そのために、オートコンプリートにそのモンキーパッチを使用しましたが、現在は正常に機能しています。しかし現在、ユーザーが「JFK、LHR、MNL」のような空港コードを入力しても、結果は得られません。

これはすべての旅行サイトが機能する方法であり、私はこれを達成するためにあなたの助けが必要です。前もって感謝します。これがオートコンプリート用のモンキーパッチを使った私のコードです。

$(document).ready(function() {
    var myArr = [];
    function parseXml(xml)
    {
        $(xml).find("CityAirport").each(function()
        {
            myArr.push($(this).attr("CityName")+"-"+$(this).attr("AirportCode"));
        }); 
    }

    function setupAC() {
        $("#from").autocomplete({
                source: myArr,
                minLength: 1,
                select: function(event, ui) {
                    $("#from").val(ui.item.value);
                }
        });
        $("#to").autocomplete({
                source: myArr,
                minLength: 1,
                select: function(event, ui) {
                    $("#to").val(ui.item.value);
                }
        });
    }

    $.ajax({
        type: "GET",
        url: "xmlFiles/flight/AirportCode.xml", 
        dataType: "html",
        success: parseXml,
        complete: setupAC,
        failure: function(data) {
            alert("XML File could not be found");
        }
    });
});
function hackAutocomplete(){    
    $.extend($.ui.autocomplete, {
        filter: function(array, term){
            var matcher = new RegExp("^" + term, "i");

            return $.grep(array, function(value){
                return matcher.test(value.value);// || value.value || value);
            });                     
        }
    });
}

このコードはこのスレッドから取得されました：SOFからのオートコンプリート

4

1 に答える 1

4

2つのデータプロパティを分割し、コールバック関数をソースパラメータとして使用する必要があります。多かれ少なかれ次のようになります（実際の動作を参照してください）。

var source = [
    { name: 'New york', code: 'JFK'},
    { name: 'Other name', code: 'BLA'},
    { name: 'Rome', code: 'FCO'}
];
$( "#autocomplete" ).autocomplete({
    source: function(request, response){
        var searchTerm = request.term.toLowerCase();
        var ret = [];
        $.each(source, function(i, airportItem){
            //Do your search here...
            if (airportItem.code.toLowerCase().indexOf(searchTerm) !== -1 || airportItem.name.toLowerCase().indexOf(searchTerm) === 0)
                ret.push(airportItem.name + ' - ' + airportItem.code);
        });

        response(ret);
    }
});​
于 2012-10-19T06:41:09.017 に答える