- 首页
- 其他开发
- Twitter Bootstrap 模态导轨删除按钮不起作用
Twitter Bootstrap 模态导轨删除按钮不起作用
[英] Twitter Bootstrap modal rails delete button not working
本文介绍了Twitter Bootstrap 模态导轨删除按钮不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在切换到 Twitter Bootstrap 2.1.1.
我有一个带删除按钮的模式,但它不起作用.在以前的引导程序版本中,它工作正常.Rails 版本是 3.1
这是代码
模态
<div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button><h3 id="myModalLabel"><%= t('delete_this_question') %></h3>
<div class="modal-body"><p><%=原始post.text %</p>
<div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true"><%= t('cancel') %></button><%= link_to(t('delete'), { :controller => 'posts', :action => 'destroy', :id => post.id } ,:method => :delete,:class => 'btn btn-primary') %>
但它不起作用.Rails 收到 GET 并显示帖子,但不会销毁它.
有什么想法吗?谢谢
解决方案
我在 http:/上找到了以下解决方案/rors.org/demos/custom-confirm-in-rails
您可以完全不显眼地使用它,而无需在您的视图中使用自定义删除链接或模式内容.所以在我看来,我有标准的 Rails 链接(只添加一些类来使用 Bootstrap 样式):
link_to 'delete', post, method: :delete, confirm: 'Are you sure?', class: 'btn btn-mini btn-danger'
以及/app/assets/javascripts/bootstrap-confirmation.js.coffee 中的以下内容
$.rails.allowAction = (link) ->除非 link.attr('data-confirm') 返回真$.rails.showConfirmDialog(link) # 查看下面的实现false # 总是停止操作,因为代码是异步运行的$.rails.confirmed = (link) ->link.removeAttr('数据确认')link.trigger('click.rails')$.rails.showConfirmDialog = (link) ->message = link.attr '数据确认'html = """<div class="modal" id="confirmationDialog"><div class="modal-header"><a class="close" data-dismiss="modal">×</a><h3>请求确认</h3>
<div class="modal-body"><p>#{message}</p>
<div class="modal-footer"><a data-dismiss="modal" class="btn">取消</a><a data-dismiss="modal" class="btn btn-danger confirm">确认</a>
"""$(html).modal()$('#confirmationDialog .confirm').on 'click', ->$.rails.confirmed(链接)
如果您想在模态中发布更多特定的详细信息,您可以随时将它们作为数据属性包含在删除链接中(就像 data-confirm
用于显示确认消息一样.)>
I am switching to Twitter Bootstrap 2.1.1.
I have a modal with a button to delete but it does not work. In previous bootstrap version it worked OK. Rails version is 3.1
Here is the code
<a title="<%= t('delete') %>" id="delete" class="label" href="#myModal-<%= post.id %>" data-toggle="modal"><%= t('delete') %></a>
the modal
<div class="modal hide" id="myModal-<%= post.id %>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel"><%= t('delete_this_question') %></h3>
</div>
<div class="modal-body">
<p><%= raw post.text %></p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true"><%= t('cancel') %></button>
<%= link_to(t('delete'), { :controller => 'posts', :action => 'destroy', :id => post.id } ,:method => :delete, :class => 'btn btn-primary') %>
</div>
</div>
But it does not work. Rails receives a GET and shows the post, but it does not destroy it.
Any idea? Thanks
解决方案
I found the following solution on http://rors.org/demos/custom-confirm-in-rails
You can use this completely unobtrusively without having to have a custom delete link or modal content in your view. So in my view I have the standard Rails link (only adding some classes to use the Bootstrap styles):
link_to 'delete', post, method: :delete, confirm: 'Are you sure?', class: 'btn btn-mini btn-danger'
And the following in /app/assets/javascripts/bootstrap-confirmation.js.coffee
$.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 = """
<div class="modal" id="confirmationDialog">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>Request confirmation</h3>
</div>
<div class="modal-body">
<p>#{message}</p>
</div>
<div class="modal-footer">
<a data-dismiss="modal" class="btn">Cancel</a>
<a data-dismiss="modal" class="btn btn-danger confirm">Confirm</a>
</div>
</div>
"""
$(html).modal()
$('#confirmationDialog .confirm').on 'click', -> $.rails.confirmed(link)
If you want more post specific details in your modal you can always include them as data- attributes in your delete link (just like data-confirm
is used to display the confirmation message.)
这篇关于Twitter Bootstrap 模态导轨删除按钮不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文