機能する Twitter の typeahead ajax 呼び出しを作成することができました。
入力が速すぎると項目が重複するという問題があります。
シナリオ例:
「Casablanca」を取得しようとすると、入力を開始し、「casa」に到達するまでに比較的適切にフィルタリングされることを期待します。残念ながら、項目が重複しているため、2 つまたは 3 つのオプションを使用する代わりに、9 ～ 20 個の D を使用します。
呼び出しを行っている JS は次のとおりです。
$(".airportSearch").typeahead({
source: function(query, process) {
airports = [];
map = {};
$.ajax({
url: url_,
dataType: "json",
data: {
n: 12, q: query
},
success: function(data) {
$.each(data, function (i, record) {
map[record.airport] = record;
airports.push(record.city + ", " + record.airport + " (" + record.iata + "), " + record.country);
});
process(airports);
}
});
},
minLength: 1,
items: 11,
sorter: function (items) {
return items.sort();
},
updater: function (item) {
selectedState = map[item].iata;
return item;
}
});
ゆっくり入力すれば問題なく動作しますが、誰もが知っているように、人々が辛抱強く待つことは期待できません!
「casa」と入力した時点で、呼び出しているサーブレットからの応答の長さはわずか 3 レコードです。
[
{"type":"airport","city":"Casablanca","airport":"Anfa","iata":"CAS","country":"Morocco","locationId":"airport_CAS"},
{"type":"airport","city":"Casablanca","airport":"Mohammed V","iata":"CMN","country":"Morocco","locationId":"airport_CMN"},
{"type":"airport","city":"Casa Grande Municipal, AZ","airport":"Casa Grande Municipal","iata":"CGZ","country":"United States","locationId":"airport_CGZ"}
]
残念ながら、私が見つけることができなかったどこかでおかしなことが起こっているようです。「casa」と入力した時点で、処理中の「airports」オブジェクトは次のようになっています。
["Casablanca, Anfa (CAS), Morocco",
"Casablanca, Mohammed V (CMN), Morocco",
"Casa Grande Municipal, AZ, Casa Grande Municipal (CGZ), United States",
"Cascade Locks, OR, Cascade Locks (CZK), United States",
"Cascavel, Cascavel (CAC), Brazil",
"Casigua, Casigua (CUV), Venezuela",
"Casino, Casino (CSI), Australia",
"Casper, WY, Casper (CPR), United States",
"Cassilandia, Cassilandia (CSS), Brazil",
"Castaway, Castaway (CST), Fiji",
"Castlegar, Castlegar (YCG), Canada",
"Castres Mazamet, Castres Mazamet (DCM), France",
"Castro Gamboa, Castro Gamboa (WCA), Chile",
"Casablanca, Anfa (CAS), Morocco",
"Casablanca, Mohammed V (CMN), Morocco",
"Casa Grande Municipal, AZ, Casa Grande Municipal (CGZ), United States",
"Casablanca, Anfa (CAS), Morocco",
"Casablanca, Mohammed V (CMN), Morocco",
"Casa Grande Municipal, AZ, Casa Grande Municipal (CGZ), United States"]
ご覧のとおり、その時点で予想していた 3 つの結果の重複と、この時点で除外されているはずのレコードの重複があります。
何らかの方法で呼び出し間で待機する必要がありますか、または重複をチェックする必要がありますか? この問題への取り組み方がよくわからないので、意見や提案をいただければ幸いです。