0

jQuery UIオートコンプリートを使用して、提案プルダウンを開かずに既存の選択ボックスにデータを入力する方法はありますか?

同様の回避策は、

http://www.barelyfitz.com/projects/filterlist/

また

http://andrew.hedges.name/experiments/narrowing/

しかし、jQuery UIを使用できますか?

4

2 に答える 2

1

レンダラーを使用してフィルター処理されたデータを取得し、それらを使用して好きなことを行うことができます

$('#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/

于 2012-11-10T23:48:29.063 に答える
0

ついに私は何時間も後にこれを理解しました。Bouillouがリダイレクトしたときにオートコンプリートのデータバインドを再検討した後、目標を達成するためにこれらを実行しました。

  1. まず、検索機能を、以前のすべての選択ボックスの内容をクリーンアップするための行を追加するための私のものを追加することで置き換えました。これが私の新しい検索機能です:

         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);
         },
    
  2. 次に、.dataバインディングとを微調整し_renderItemました。return $('');プロセスを中断し、nullの提案ボックスを持つ1つの提案のみを返します。(私も見たくないです。)

次に、元return(.....)_renderItem関数を次のように変更しました。

        return $('<option value="'+item.value+'">'+item.label+'</option>')
        .appendTo("#links_list");

以下にサンプル画面の結果を示します。

そしてその結果

于 2012-11-11T01:30:41.713 に答える