2013-03-05 28 views
9

私はSelect2を初めて使用しており、AJAXの統合に問題があります。検索すると、結果はクエリに基づいてフィルタリングされません。Select2クエリに基づくAjaxフィルタリング結果がありません

次のようになります。http://i.imgur.com/dAPSSDH.png - 正しい文字には結果に下線が引かれますが、除外されるものはありません。私の非Ajax Select2と私が見た例では、フィルタリングは幾分自動的に行われるようですので、カスタムフィルタを作成することは躊躇しています。ここで

は私のコードです:

<script> 
    $("#search_bar").select2({ 
    placeholder: "Search for another Concept", 
    minimumInputLength: 1, 
    ajax: { // instead of writing the function to execute the request we use Select2's convenient helper 
     url: "/concepts/names_for_search", 
     dataType: 'json', 
     data: function (term, page) { 
     return { 
     q: term, // search term 
     page: page 
     }; 
     }, 
     results: function (data, page) { 
     return { results: data}; 
     } 
    }, 
    }); 
</script> 

また、ここに私のJSONの例である:

[{"id":1,"text":"Limits"},{"id":2,"text":"Derivatives"},{"id":3,"text":"One-Sided Limits"},{"id":4,"text":"Formal Definition of a limit"}] 

任意のアイデア?うまくいけば、私はちょうど何か愚かなことをやっているし、それは迅速な修正です。助けを前にありがとう。

+1

私もこれを行うには良い方法があったことを望みます!私はすべての行が既に私と一緒にいるならば、フィルタリングするだけでサーバに行くのは直感的ではありません! –

答えて

9

結果をフィルタリングするには、サーバー側にカスタムフィルタを作成する必要があります。ボックスに入力した内容は 'term'に保存され、ajax呼び出しで 'q'がリクエストパラメータとして送信されます。そのため、ajaxの
url: "/ concepts/names_for_search?q = deri"
の呼び出しでは、すべての結果ではなく、フィルタリングされた結果のみが返されます。

更新
Select2は、検索ボックスに入力するたびにAJAX呼び出しを行います。サーバー側で結果をフィルタリングし、検索ボックスのテキストに基づいて結果を返す必要があります。
JavaScriptコードが正しい

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException 
{ 
    String searchTerm = request.getParameter("q"); 

    String json = getOptions(searchTerm); 
    //getOptions method will return a string of in JSON format 
    //[{"id":"1","name":"Derivatives"}] 
    response.getWriter().write(json); 
} 

以下のように私は私のJSP /サーブレットアプリケーションでそれを使用しています。

セレクタ2が使用されましたです。 http://www.indiewebseries.com/search?q=indhttp://www.indiewebseries.com/search?q=inのリンクを開くと、得られる結果が異なり、 'q'パラメータに基づいています。
あなたの場合には、URLへの呼び出しの結果 '/をコンセプト/ names_for_search?Q = D' と '/コンセプト/ names_for_search?Q = DERI'

+0

こんにちはありがとう、ごめんなさい、この応答はとても遅いです。あたかもAJAXをやっていないかのようにフィルタを再利用する方法はありますか(おそらく、ソースコードからコピー/ペーストする)?また、私に指摘できる例を知っていますか?軽いグーグルグーグルが驚くほど少なくなっています。あなたの助けをありがとう - 私は人々をupvoteすることができたら、あなたは間違いなく1つを得るでしょう。 –

+1

@MichaelNomitch - 私は答えを更新しました。お役に立てれば。 – darsheets

2

(すなわちフィルタリングされない)と同じです。この質問は尋ねたがgithubプロジェクトでは、答えは:サーバー側のフィルタ。 AJAXを使用しない場合に呼び出されるデフォルトのフィルタ機能がmatcherパラメータの選択2ドキュメントに存在している:

function(term, text) { return text.toUpperCase().indexOf(term.toUpperCase())>=0; } 
関連する問題