JS変数をRailsに非同期で送信する方法

Question

ビュー内の単純なHTMLフォーム。ユーザーが選択したフォームの値が、ユーザーが切り替えたときにアクティブレコードのクエリに渡す必要があります。 （恐らく非同期ではないので、おそらくparamsではないでしょうか？）

以下の例では、business_idをフォームの値にする必要があります。あなたは私が後でリソースにそれをリファクタリングを扱うますジャバスクリプト、ページ内のいくつかを提供することができますので、もし、レールに新...

<select name="clients"> 
    <option value="1">Tesla</option> 
    <option value="4">Chevy</option> 
</select> 

<table> 
    <% @clients.where(month_year:'2015-02',business_id:'NEED VALUE OF HTML FORM HERE').find_each do |client| %> 
    <tr> 
     <td><%= client.month_year %></td> 
     <td><%= client.business_id %></td> 
     <td><%= client.bill_charge %></td> 
    </tr> 
    <% end %> 
</table> 

Answer 1

答え、ここに（おそらく）過度に簡略化された模擬があります。

クライアントビュー ここでは、部分的に指し示すrenderを呼び出す必要があります。この部分データにはテーブルデータが含まれます（後で再開できるようになります）。また、jqueryがクライアントデータの非同期フェッチを簡単に行うことができるクラスをselectステートメントに与える必要があります。

# app/views/clients/index.html.erb 
<%= select_tag "business", options_from_collection_for_select(Business.all, "id", "name"), class: "car-select" %> 

<div class="clients-table"> 
    <%= render "table_list" %> 
</div> 

あなただけのインデックスビューを切り出しテーブルで 部分的な表には、部分的

# app/views/clients/_table_list.html.erb 
<table> 
    <thead> 
    <tr> 
     <th>Month year</th> 
     <th>Business</th> 
     <th>Bill charge</th> 
    </tr> 
    </thead> 

    <tbody> 
    <% @clients.each do |client| %> 
     <tr> 
     <td><%= client.month_year %></td> 
     <td><%= client.business.try(:name) %></td> 
     <td><%= client.bill_charge %></td> 
     </tr> 
    <% end %> 
    </tbody> 
</table> 

AJAXスクリプト これに貼り付ける必要があります変更を監視してクライアントデータの要求を提出する必要があります

​​

企業コントローラのプロセスを使用すると、URLに呼び出しているあなたのAjaxリクエストで を要求するような、「http://yourapp.com/businesses/23」、本当にあなたのビジネスコントローラのshowアクションを当たります。完全にRESTfulで、ルートを変更する必要がないため、この方法で実行する必要があります。しかし、クライアントのインスタンス変数を提供するアクションを編集する必要があります。

# app/controllers/businesses_controller.rb 
def show 
    @business = Business.find(params[:id]) 
    @clients = @business.clients (this assumes that you already have a proper has_many/belongs_to relationship between business and client) 
    respond_to do |format| 
    format.html 
    format.js 
    end 
end 

UJSビュー パズルの最後のピースは、UJS図です。これは、js要求タイプが特定のコントローラアクションに送信されたときにのみ呼び出されるjavascriptです。この場合、ビジネスコントローラのshowアクション。これは新しく作成された@clientsを取り、既存のテーブルを部分データと新しいデータに置き換えます。

#app/views/businesses/show.js.erb 
$(".clients-table").html("<%= escape_javascript(render('/clients/table_list', client: @clients)) %>"); 

さらに複雑なことや質問が残っている場合は、UJSテンプレートとコールバックについて少し研究してください。

Answer 2

• は部分的にあなたの結果テーブルを置きます。
• 他に言えば、選択
• の変更に関するイベントのAJAXリクエストは、リクエスト変数（ `@clients'）として渡した選択の値に基づいてテーブルをレンダリング火