使用 Ajax 更新 Rails 索引视图中的复选框值

Question

我想在 Rails 应用程序中应用一个小型 Ajax 示例。我在索引视图中有一个带有复选框的项目模型。我为我在索引视图中呈现的复选框创建了一个 form_for。我想检查复选框并更新数据库中的复选框值。 我正在学习 Ajax，并通过添加 beforeSend 和函数（数据）应用了一些测试。从我读到的 Ajax 有 POST 和 GET。如果我添加 type: 'POST' Rails 会尝试创建一些东西，不会找到有效的路由路径并且会出错。我想更新在 Rails 中是 PUT 的 DB 中的复选框值。我应该如何进行？你能指出我正确的方向吗？

这是我在索引视图中呈现的表单。

<%= form_for(c, remote: true) do |k| %>
<%= k.check_box :recyclable, :class => "active_testdef_cl", :id => "item_recyclable_#{c.id}", 'data-recyclable' => c.recyclable %>
<% end %>

这是脚本。

<script>
     $(document).ready(function() {
       for (var i=0; i < 2; i++ ) {          
             $('#item_recyclable_'+i).on('change', function(){               
             var url='/items'
             var form_data = $('#cc_form').serialize;
             var checkbox_value = $('#item_recyclable_'+i).val();
                  $.ajax({
                  type: 'GET',
                  url: url,                  
                  data: checkbox_value,
                      beforeSend:function(){
                          // $('#test_message').innerHTML=("hello Christina");
                          //alert("hi m")
                      },                 
                    success: function(data) {
                        //$('#test_result').html(data);
                          document.getElementById('test_result').innerHTML=data; 
                    }
              });
              return false;
          });
       };
    }); 
</script>

Answer 1

Restful 路由将“PUT”和“DELETE”方法分配给各种请求，但实际上这些http 方法往往不会被使用，因为许多浏览器（可能只是某些版本的IE）不允许它们。因此，您实际上只发送 GET 和 POST 请求。

解决方法是发送一个额外的参数"_method"（注意下划线），您可以将其设置为“PUT”或“DELETE”。所以，如果你要添加

"_method": "PUT"

到您的 ajax 调用的数据，然后 Rails 应该将其作为 PUT 请求处理。当您定义 form_data 然后不使用它时，我真的不知道您的 ajax 中发生了什么。

如果您在 rails 中使用 form_for 帮助器，并且它会调用更新操作，请查看浏览器中呈现的 html。你会看到一个隐藏的 div，里面有这样的输入：

<div style="display:none;">
  <input type="text" name="_method" value="UPDATE">
</div>

这是 Rails 为您设置的解决方法。见http://guides.rubyonrails.org/form_helpers.html#how-do-forms-with-patch-put-or-delete-methods-work-questionmark