如何使用bootstrap的模态显示“删除确认对话框”？ 不喜欢浏览器的默认值

我正在看这个页面（ http://lesseverything.com/blog/archives/2012/07/18/customizing-confirmation-dialog-in-rails/ ）它显示了一些代码，但我不明白我是怎么做的可以实现它到我的应用程序。

我使用Rails3.2，Bootstrap.css和JQuery。
有人能告诉我究竟需要做些什么来显示带有bootstrap模式的“删除确认对话框”吗？

更新：

资产/ Java脚本/ application.js中

// This is a manifest file that'll be compiled into application.js, which will include all the files // listed below. // // Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts, // or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path. // // It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the // the compiled file. // // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD // GO AFTER THE REQUIRES BELOW. // //= require jquery //= require jquery-ui //= require twitter/bootstrap //= require_tree . //= require jquery.ui.datepicker //= require autocomplete-rails 

Answer 1

博客条目使用coffeescript。 假设您在rails表单中使用:confirm选项，那么您需要覆盖Rails中的默认操作，方法是将以下代码放在资源管道中的.js.coffee文件中（ app/assets/javascript ） ：

 $.rails.allowAction = (link) -> return true unless link.attr('data-confirm') $.rails.showConfirmDialog(link) # look bellow for implementations false # always stops the action since code runs asynchronously $.rails.confirmed = (link) -> link.removeAttr('data-confirm') link.trigger('click.rails') $.rails.showConfirmDialog = (link) -> message = link.attr 'data-confirm' html = """ 
 
 × 
#{message}
 
 
 
Are you sure you want to delete?
 
 
 Cancel OK 
 
 """ $(html).modal() $('#confirmationDialog .confirm').on 'click', -> $.rails.confirmed(link) 

然后，您可以在视图中使用此类链接，它们应显示Bootstrap模式而不是标准浏览器弹出窗口：

 <%= link_to 'Delete', item, :method => :delete, :confirm=>'Are you sure?' %> 

UPDATE

这对我来说也适用于:remote => true选项。

因此，如果我在index.html.erb视图中有类似以下内容：

  <% @posts.each do |post| %>  <% end %> 
 
 
Name
 
Title
 
Content
 
 
 
 
 
<%= post.name %>
 
<%= post.title %>
 
<%= post.content %>
 
<%= link_to 'Show', post %>
 
<%= link_to 'Edit', edit_post_path(post) %>
 
<%= link_to 'Destroy', post, method: :delete, :remote => true, data: { confirm: 'Are you sure?' } %>
  

并且控制器中的destroy动作在respond_to中有format.js ：

  # DELETE /posts/1 # DELETE /posts/1.json def destroy @post = Post.find(params[:id]) @post.destroy respond_to do |format| format.js format.html { redirect_to posts_url } format.json { head :no_content } end end 

这在destroy.js.erb中：

 $("tr#<%= @post.id %>").fadeOut(); 

然后一切正常。 单击“ Destroy链接时，将弹出“引导程序确认”对话框，单击“确定”后，该行将淡出并在服务器上销毁。