jQuery UIオートコンプリートを使用して、提案プルダウンを開かずに既存の選択ボックスにデータを入力する方法はありますか?
同様の回避策は、
http://www.barelyfitz.com/projects/filterlist/
また
http://andrew.hedges.name/experiments/narrowing/
しかし、jQuery UIを使用できますか?
jQuery UIオートコンプリートを使用して、提案プルダウンを開かずに既存の選択ボックスにデータを入力する方法はありますか?
同様の回避策は、
http://www.barelyfitz.com/projects/filterlist/
また
http://andrew.hedges.name/experiments/narrowing/
しかし、jQuery UIを使用できますか?
レンダラーを使用してフィルター処理されたデータを取得し、それらを使用して好きなことを行うことができます
$('#myAutocomplete').data( "autocomplete" )._renderItem = function( ul, item ) {
$('#myCustomElement').append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
//Cancel the suggestion rendering
//return void since 1.9 else just return false
return $('');
};
http://jqueryui.com/autocomplete/#custom-dataに触発されました
編集
提案リストを回避する方法を説明するフィドルを追加します:http://jsfiddle.net/GF5c4/
ついに私は何時間も後にこれを理解しました。Bouillouがリダイレクトしたときにオートコンプリートのデータバインドを再検討した後、目標を達成するためにこれらを実行しました。
まず、検索機能を、以前のすべての選択ボックスの内容をクリーンアップするための行を追加するための私のものを追加することで置き換えました。これが私の新しい検索機能です:
search: function( event, ui ){
$("#links_list option").remove(); // This line is added
var str = '';
for(var attr in event){
str += attr.toString() + '\n';
}
console.log(str);
var str2 = '';
for(var attr in ui){
str2 += attr.toString() + '\n';
}
console.log(str2);
},
次に、.data
バインディングとを微調整し_renderItem
ました。return $('');
プロセスを中断し、nullの提案ボックスを持つ1つの提案のみを返します。(私も見たくないです。)
次に、元return(.....)
の_renderItem
関数を次のように変更しました。
return $('<option value="'+item.value+'">'+item.label+'</option>')
.appendTo("#links_list");
以下にサンプル画面の結果を示します。