2012-06-10 72 views
0

我有一個表單中的兩個選擇字段。每當這些選擇字段中的一個改變值時,表單的其餘部分應該改變。我使用的選擇字段下面的代碼:遠程選擇,控制器需要更多的表格數據

<%= f.collection_select :model1, Model1.all, :id, :name, "data-remote" => true, "data-url" => "/model3/get_rest_form" %> 
<%= f.collection_select :model2, Model2.all, :id, :name, "data-remote" => true, "data-url" => "/model3/get_rest_form" %> 

現在的問題是,model3控制器需要,以制定到發送給它的Ajax請求的響應都選擇字段的值,但它只是變得剛剛在參數中更改的選擇字段的值。

如果MODEL1域改變我得到:

params = {"model3"=>{"model1"=>"2"}} 

如果MODEL2域改變我得到:

params = {"model3"=>{"model2"=>"3"}} 

但我需要在這兩種情況下。

params = {"model3"=>{"model1"=>"2", "model2" => "3"}} 

我該如何認識到這一點?

也許有一種方法可以在選擇字段發生變化時發送所有表單數據。

謝謝!

回答

0

在閱讀jquery_ujs.js文件後,我提出了以下解決方案。很顯然,選擇標籤的data-params屬性中存在的數據將被添加到使用ajax請求發送給控制器的數據中,並且在準備ajax請求的最初階段,'ajax:before '事件在select元素上被觸發。我使用這個事件來讀取表單中的數據,將其序列化並將其放入select元素的data-params標記中。這些數據會自動添加到ajax請求中。這裏是我的代碼:

$(".add_form_data").on('ajax:before', function(event){ 
    var form = $(this).closest('form'); 
    var formData = form.serialize(); 
    $(this).data("params",formData); 
}); 

唯一剩下要做的就是給add_form_data類添加到兩個選擇的元素。

<%= f.collection_select :model1, Model1.all, :id, :name, "data-remote" => true, "data-url" => "/model3/get_rest_form" :class => "add_form_data" %> 
<%= f.collection_select :model2, Model2.all, :id, :name, "data-remote" => true, "data-url" => "/model3/get_rest_form" :class => "add_form_data" %>