jquery - 单击 form_for 中的 HTML 按钮时防止自动刷新

Question

我将 Rails form_for 助手与数据表混合在一起，该数据表在 form_for 之外使用它自己的 HTML 编码按钮来选择和取消选择记录。但是，如果我单击数据表顶部的“全选”按钮，页面会自动刷新，并且表中的所有选择都将丢失:

    <%= f.label :call_order %>
    <%= f.check_box :call_order %>

    **Datatables implementation**
    <button id="selectAllRestaurantsForCampaign">Select All</button>
    <button id="deSelectAllRestaurantsForCampaign">Deselect All</button>
    <table id="restaurantsForCampaign" class="display" cellspacing="0" width="100%">
         <... Table Code ...>
    </table> 

    <hr>
    <strong>Campaign Active</strong>

    **Final attribute in form_for**
    <%= f.check_box :is_active %>
    <br>

    <%= f.submit "Save changes", class: "btn btn-large btn-primary" %>

我想阻止页面刷新，直到用户单击页面底部的 form_for 提交按钮:

<%= f.submit "Save changes", class: "btn btn-large btn-primary" %>

当前用于“取消选择”和“全选”按钮的 CoffeeScript 是:

 # Conditional 'Select All' (works)
  $("#selectAllRestaurantsForCampaign").click ->
    table.$('tr', {"filter":"applied"}).addClass "selected"

  # Deselecting all (works)
   $("#deSelectAllRestaurantsForCampaign").click ->
    table.$("tr").removeClass "selected"

如何防止页面刷新，直到单击“提交”？

Answer 1

如果我只有标签 <button></button>那么它实际上充当提交从而刷新页面。

我应该做的是将其设置为 <button type="button"></button>这样页面就不会刷新，但仍然允许功能和动态内容与按钮提交一起使用