2016-05-17 5 views
0

私はフィルタリングする複数のフィールドを含むドロップダウンでライブ検索を実装しています.1つの検索フィールド、検索対象を選択するドロップダウン、さらにフィルタを追加すると、ユーザーがボタンをクリックすると、次のような新しいフィールドが生成されます。enter image description hereJavaScript内でルビコードを使用する方法

この画像サンプルは、JavaScript内のhtmlでハードコードされています。問題は私が多くのビューでそれを使用するので、最初にRubyを使って最初の検索フィールドを生成するコードと同じように動的にする必要があることです。私はこのようにしてみましたが、成功は達成されませんでした。

$(function() { 

    function search() { 
     $.get(window.location.href, { object_columns: $("select#object_columns").val(), search: $("#search").val() }, null, "script"); 
    }; 

    $("select#object_columns").change(search); 
    $("input#search").keyup(search); 

    $('button').on('click',function(){ 
     column = "<%= j render 'shared/search_engine' %>"; 
     $('#search-form').after(column); 
    }); 
}); 

search_engine.html.erb

<div id="search-form"> 
    <%= form_tag do %> 
    <% valid_column_names = target.column_names.reject{|r| r == "created_at" || r == "updated_at" || r == "slug"} %> 
    <%= select_tag :object_columns, options_for_select(valid_column_names) %> 
    <%= text_field_tag :search, '', autocomplete: :off %> 
    <% end %> 
    <%= button_tag "+" %> 
</div> 

live_search.js.erb

私もコードを複製するためにJavaScriptで "検索フォーム" を呼び出そうとしましたボタンがクリックされたときに私はそれが不可能であると読んだ。 @ppascualvが提案されているよう

EDITは、私はいくつかの変更を行ったが、私はボタンをクリックしたときに、私はまだレンダリングし、別の「SEARCH_ENGINE」を追加することはできません。私はの定義されていないメソッド 'render'と言っているエラーを受け取ります。

live_search.js.erb

$(function() { 

    function search() { 
     $.get(window.location.href, { object_columns: $("select#object_columns").val(), search: $("#search").val() }, null, "script"); 
    }; 

    $("select#object_columns").change(search); 
    $("input#search").keyup(search); 

    $('button').on('click',function(){ 
     $('button').append("<%= escape_javascript(render @search_engine) %>"); 
    }); 
}); 

search_engine.html.erb

<div id="search-form"> 
    <%= form_tag({controller: "house_activities", action: "index"}, method: "get", remote: true) do %> 
    <% valid_column_names = HouseActivity.column_names.reject{|r| r == "created_at" || r == "updated_at" || r == "slug"} %> 
    <%= select_tag :object_columns, options_for_select(valid_column_names) %> 
    <%= text_field_tag :search, '', autocomplete: :off %> 
    <% end %> 
    <%= button_tag "+" %> 
</div> 

house_activities_controller.rb

答えて

関連する問題