2011-12-05 10 views
3

私のサイトでjqueryUIオートコンプリートウィジェットを使用しています。jqueryUIオートコンプリートオプションをフィルタリングする

  • リンゴ...私は私のデータベースの以下の項目を持っていると言う
  • アブラハム
  • ツチブタ

"" オートコンプリートウィジェットに私は得るIタイプ私の入力フィールドの下にリストします。アイテムを選択すると、入力フィールドの下のULに追加され、入力フィールドがクリアされるように、追加のコードを記述しました。

「a」と入力すると、そのリストが表示され、appleを選択します。アップルは現在、入力フィールドの下のULのLIです。もう一度 "a"と入力すると、リストが再び表示されます。これは私の問題です。

もう一度、りんごを除いてすべてを表示したい。

私は2つの異なる場所でこれを行う方法を知ってみたい

1 - の代わりに送信するように私は、サーバーへのGETクエリを発射イベントをインターセプトする方法を知ってみたいです"q = a"と入力すると、サーバーに "a"と入力すると、 "q = a & exclude = apple、foo、bar"を送信できます。次に、リストサーバー側をフィルタリングし、すべてがうまくいきます。

2 - 私はオプションのリストを構築するイベントをインターセプトする方法も知りたいです。そうすれば、「apple、ape、etc」のオプションを表示しようとしていることがわかりました。そのリストから「apple」を切り取ることができます。

私はドキュメントのイベントを見ていますが、私は上記の目的を達成するためにそれらをどのように使用するかはわかりません。

ありがとうございます!

答えて

2

オートコンプリートウィジェットのsourceオプションの機能を定義することで、これらの両方を達成できます。そこから、$.ajaxでAJAXリクエストを自分で実行します。私はあなただけulにすでに項目を抽出することにより、除外項目を建設すると想像

$("input").autocomplete({ 
    source: function (request, response) { 
     var exclude = /* build excluded items list. */; 
     var term = request.term; 

     $.ajax({ 
      url: "server.php", 
      data: { q: term, exclude: exclude }, 
      dataType: "json", 
      success: function(data) { 
       /* Here, you could accomplish #2 by filtering items out of data */ 
       /* You must call the supplied callback to let the widget know what to suggest */ 
       response(data); 
      } 
     }); 

    } 
}); 

:ような何か。

+0

素晴らしい - ありがとうございます。 – chrispitzer

関連する問題