Rails通过jquery从所有复选框获取状态并将其发送到控制器

时间:2017-06-03 17:22:23

标签: jquery ruby-on-rails ajax checkbox

到目前为止,我有以下设置:

我的复选框声明如下:

<label id="cb2" class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="checkbox-1">
     <input type="checkbox" id="checkbox-1" class="mdl-checkbox__input">
     <span class="mdl-checkbox__label">Meal</span>
</label>

我有以下JQuery代码:

<script>
   $(document).ready(function() {
   $("input[type='checkbox']").change(function() {
       $("#change_me").html("<%= j render(partial: 'dynamic_test') %>");
     });
   });
</script>

所以,一旦我选中或取消选中一个复选框,我想获取所有复选框的check属性并将它们发送到我的控制器(ajax?),然后我想执行一些选择查询并在“dynamic_test”中呈现它。有人可以告诉我如何实现向我的控制器发送数据。

编辑:

我的_dynamic_test.html.erb包含:

Some Test!
<%= @check_box_val %>

EDIT2:

我让它像这样工作:

<script>
 $(document).ready(function() {
 $("input[type='checkbox']").change(function() {
   var selected_checkbox_val = [];
    $("input[type='checkbox']").each(function() {
        if ( this.checked ) {
            selected_checkbox_val.push(this.getAttribute("name"));
        }
    });
    $.ajax({
      url: "/meals/dynamic_test",
      type: "POST",
      data: { 
        value: selected_checkbox_val
      },
      dataType: 'script'  
    });
   });
 });
</script>

如果你看到更好的方式,我愿意接受改变。

1 个答案:

答案 0 :(得分:0)

这就是你应该这样做的方式

<script>
$("input[type='checkbox']").change(function() {
  var selected_checkbox_val = $(this).val();
  $.ajax({
    url: "/meals/dynamic_test",
    type: "POST",
    data: { 
      value: selected_checkbox_val
    },
    dataType: 'script'  
  });
}
</script>

在控制器dynamic_test方法

def dynamic_test
  @check_box_val = params[:value]
  respond_to do |format|
    format.js
    format.html
  end
end

你应该有一个名为dynamic_test.js.erb的文件,其中包含以下代码

$("#change_me").html("<%= j render(partial: 'dynamic_test', locals: {check_box_val: @check_box_val}) %>");

此外,您应该为此方法定义路线

post "/meals/dynamic_test" => "meals#dynamic_test"

注意:

您可以更改部分的名称,以避免在主模板部分模板之间造成混淆。