按钮内带有操作的图标

Question

我正在使用 RoR 3.1 和 Twitter Bootstrap，并且想要创建一个链接到控制器操作的按钮 - 需要注意的是该按钮的 内部，我想添加一个'icon-remove' 链接，点击后会删除包含的按钮。

这可能吗？

我的工作按钮：

<%= link_to exp, edit_exp_path, :class => "btn btn-inverse", :controller => :exps, :method => :edit %>

我的“删除”图标：

<%= link_to "", exp_path(exp.id), :class => "icon-remove", :confirm => "Are you sure?", :controller => :exps, :method => :delete  %>

如何将删除图标放在按钮内？

编辑：为了清楚起见，我想保留按钮的两个操作。单击按钮文本应链接到“编辑”控制器操作，而单击 Bootstrap 的“图标删除”类提供的“x”应删除按钮。

Answer 1

你应该使用一个按钮组：http://twitter.github.com/bootstrap/components.html#buttonGroups

左边的按钮是你的普通按钮，右边是你的X。

我认为这对用户来说更有意义，并且会最大限度地减少点击错误的次数。

Answer 2

将您的课程放在链接的文本中：

<%= link_to "<span class='btn btn-inverse'>#{exp}</span>".html_safe, edit_exp_path, :controller => :exps, :method => :edit %>

<%= link_to "<i class='icon-remove'></i>".html_safe, exp_path(exp.id), :confirm => "Are you sure?", :controller => :exps, :method => :delete %>

使用 html_safe 正确显示内容。

已编辑：在第一个链接中添加了用于编辑 exp 的示例

这是我自己的代码示例：

<%= link_to "<span class='btn btn-inverse'>Test Data</span>".html_safe, "#" %>

显示按钮：