在Ruby on Rails中將Bootstrap圖標添加到按鈕

Question

我想在軌道上的紅寶石中為按鈕添加一個圖標。 目前我嘗試過以下方法：

<%= button_to raw("<i class=\"icon-arrow-up\"></i>"),
{:controller => 'events', :action => "upvoteEvent", :method => "put",
:id => @event.id, :uid => current_user.id},
{:class => "btn btn-success"}%>

它產生以下html：

<form action="/events/upvoteEvent?id=17&amp;method=put&amp;uid=7" class="button_to" method="post"><div><input class="btn btn-success" type="submit" value="<i class="icon-arrow-up"></i>" /><input name="authenticity_token" type="hidden" value="FsVUPiYl0cK666pn8hqo6AU9/HK0CweZ/nsXqwOWZzU=" /></div></form>

我按照這里發布的解決方案： https ： //stackoverflow.com/a/10468935/1385324 ，但它對我不起作用。 我還測試了Bootstrap CSS是否正常工作，只需在網站上的任何其他位置插入一個圖標即可。

謝謝你的幫助！

Answer 1

你也可以試試這個：

<%= link_to 'Upvote <i class="icon-arrow-up"></i>'.html_safe, 'events/upvoteEvent', class: => 'btn btn-success' %>

或者對於真正的提交按鈕，這個：

<%= button_tag(:type => 'submit', :class => 'btn btn-success') do %>
Upvote <i class="icon-up-arrow icon-white"></i>
<% end %>

Answer 2

如果您只是在尋找一個看起來像按鈕的鏈接，您可以這樣做：

<%= link_to 'Upvote <i class="icon-arrow-up"></i>', 'events/upvote', class: 'btn btn-success' %>

如果要將其用於表單，可以使用button_tag ， submit_tag或f.submit 。

<%= submit_tag 'Upvote <i class="icon-arrow-up"></i>', html: { class: 'btn btn-success' } %>

Answer 3

如果你在Twitter Bootstrap網站上看到這個頁面的底部，你會發現有些按鈕上有圖標。 然后你可以查看來源，看看他們是如何做到的 - 我會說這將是一個很好的起點。

Answer 4

更好，更清潔的方式是：

= link_to 'events/upvoteEvent', class: => 'btn btn-success' do
   Upvote
   <i class="icon-arrow-up"></i>'.html_safe

Answer 5

感謝您的幫助，最終修改了我自己的html輸出，使其工作：

<form action="/events/upvoteEvent?id=<%= @event.id.to_s%>&amp;method=put&amp;uid=<%= current_user.id.to_s%>" class="button_to" method="post">
    <button type="submit" value="upvote" class="btn btn-success">
        <i class="icon-arrow-up"></i>
    </button>
</form>