2012-06-10 23 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" %>