Добавление значка кнопки Bootstrap Twitter в button_to в Rails
Я работаю над > Agile Web Development with Rails, но я использовал Twitter Bootstrap вместо обычного стиля из книги. У меня возникли проблемы с добавлением значка через GLyphonics в метод button_to. Мой код выглядит следующим образом:
<%= button_to <i class="icon-search icon-white">Add To Cart</i>,
line_items_path(product_id: product),
class: "btn btn-success" %>
Я попробовал несколько вариантов, но не могу заставить его работать правильно.
Ответы
Ответ 1
Похоже, у вас есть проблема с вашими цитатами:
<%= button_to raw("<i class=\"icon-search icon-white\">Add To Cart</i>"),
line_items_path(product_id: product),
class: "btn btn-success" %>
Включите ярлык кнопки в двойных кавычках, избегайте двойных кавычек в тэге i
и, наконец, оберните все в вызов raw()
, чтобы убедиться, что HTML правильно отображается.
В качестве альтернативы вы можете использовать html_safe
:
<%= button_to "<i class=\"icon-search icon-white\">Add To Cart</i>".html_safe,
line_items_path(product_id: product),
class: "btn btn-success" %>
Хорошая точка из @jordanpg: у вас не может быть HTML в значении кнопки, поэтому его решение более подходит и должно получить одобренный статус.
часть html_safe
остается действительной.
Ответ 2
Я не уверен, как OP получил это для работы, но Rails button_to
генерирует элемент <input type='submit' />
, который не позволяет HTML в поле значений.
См. также: input type = "submit" Тег кнопки Vs являются взаимозаменяемыми?
Лучшей альтернативой в этой ситуации является принудительное выполнение link_to
PUT (или POST):
<%= link_to raw("<i class=\"icon-search icon-white\">Add To Cart</i>"),
line_items_path(product_id: product),
class: "btn btn-success",
method: :put %>
Ответ 3
Вы можете добавить значок в качестве дочернего элемента:
<%= button_to button_path, method: :delete do %>
<span class="glyphicon glyphicon-search"></span>
<% end %>
Ответ 4
Использование raw() или #html_safe все равно не работает для меня.
Я использую вспомогательный метод для создания содержимого кнопки button_to. В моем вспомогательном методе завершилось использование следующего метода (путь определен заранее):
form_tag path, :method => :post do
button_tag do
content_tag :i, 'Flag as inappropriate', :class => 'icon-flag flag_content'
end
end
Ответ 5
Я использовал этот, и он отлично работает для меня:
<%= link_to(line_items_path(product_id: product),
method: :put,
class: 'btn btn-success') do %>
<%= content_tag('i', nil, class: 'icon-search icon-white') %> Add To Cart
<% end %>
Надеюсь, что это поможет
Ответ 6
Я использую этот помощник:
module ApplicationHelper
def glyph(*names)
content_tag :i, nil, class: names.map{|name| "icon-#{name.to_s.gsub('_','-')}" }
end
end
Пример:
glyph(:share_alt)
=> <i class="icon-share-alt"></i>
и
glyph(:lock, :white)
=> <i class="icon-lock icon-white"></i>
Ответ 7
Используя Rails 4 и Bootstrap 3, здесь, как создать кнопку удаления с помощью link_to
или button_to
.
Обратите внимание, что я использую Haml вместо Erb.
На ваш взгляд:
- @users.each do |user|
= link_to content_tag(:i, ' Delete', class: "glyphicon glyphicon-trash"),
users_path(user),
class: "btn btn-danger",
method: :delete,
data: { confirm: "Delete user #{user.username}?" }
Вы также можете заменить часть content_tag
на
raw('<i class="glyphicon glyphicon-trash"> Delete</i>'),
Ответ 8
Эта работа для меня (и с подтверждением)
<%= button_to "/home/delete?cardId="+card.id.to_s, data: { confirm:'Are you sure you want to delete?' } do %>
<i class="fa fa-times"></i>
<% end%>
это сгенерирует
<form class="button_to" method="post" action="/home/delete?cardId=15">
<button data-confirm="Are you sure you want to delete?" type="submit">
<i class="fa fa-times"></i>
</button>
</form>