Bootstrap模式不关闭和刷新索引页面

时间:2015-08-02 16:36:29

标签: jquery ruby-on-rails twitter-bootstrap modal-dialog

我的编辑/更新模式无法正常工作。我希望它更新数据库,关闭模式并将用户返回到我的索引页面,其中应该更新包含我的产品的表。现在它只是更新数据库,但没有关闭模式,用户必须刷新浏览器才能看到更新的记录。我使用这些宝石

gem 'rails', '4.2.1'
gem 'bootstrap-sass', '~> 3.3.5'
gem 'responders', '~> 2.0'

这是我的index.html.erb

...
 <tbody class="product-index">
   <%= render "index" %>
 </tbody>
</table> #starting <table> tag is up higher..
</div>
<div id="product-modal" class="modal fade">
<div class="modal-dialog">
<div id="inner-product-modal" class="modal-content"></div>
</div>
</div>

这是我创建编辑链接的_index部分:

 <% @products.each do |product| %>
<tr>
 <td><%= product.name %></td>
 <td><%= number_to_currency product.price %></td>
 <td><%= link_to "Edit", edit_product_path(product), remote: true, class: 
 "btn btn-default" %></td>
 <td><%= link_to "Delete", product_delete_path(product), remote: true, 
 class: "btn btn-danger" %></td>
</tr>
<% end %>

这是我的产品控制器的编辑和更新操作

 def edit
     @product = Product.find(params[:id])
 end

 def update
    @products = Product.all
    @product = Product.find(params[:id])
    @product.update_attributes(product_params)
 end

这是我的edit.js.erb文件

$("#inner-product-modal").html("<%= escape_javascript(render 'edit') %>");
$("#product-modal").modal("show")

这是我的_edit partial

<div class="modal-header">
  <h3><%= "Editing #{@product.name}" %></h3>
</div>
<%= render "form" %>

然后最后这是我的形式部分(为简洁而编辑)

<%= form_for @product, remote: true, html: { class: "form-horizontal", 
style: "display:inline;" } do |f| %>
    <div class="modal-body">
      <ul class="errors"></ul>
....

<div class="modal-footer">
    <%= f.submit class: "btn btn-primary" %>
    <%= link_to "Cancel", "#", class: "btn", data: {dismiss: "modal"} %>
</div>
<% end %>

1 个答案:

答案 0 :(得分:1)

如果您想使用正常post方法提交更新请求并刷新页面,则应从remote: true帮助中删除form_for

<强>更新

update控制器操作结束时执行重定向:

def update
  @products = Product.all
  @product = Product.find(params[:id])
  @product.update_attributes(product_params)
  redirect_to your_index_path
end