ruby-on-rails - popper - rails add bootstrap 4

Agregar un icono de botón de inicio de Twitter a button_to en Rails

Question

Estoy trabajando en el libro Agile Web Development with Rails , pero he estado usando Twitter Bootstrap en lugar del estilo personalizado del libro. Tengo problemas para agregar un ícono a través de GLyphonics al método button_to . Mi código se ve así:

<%= button_to <i class="icon-search icon-white">Add To Cart</i>, 
              line_items_path(product_id: product), 
              class: "btn btn-success" %>

He probado algunas variaciones, pero parece que no puedo hacer que funcione correctamente.

Answer 1

El uso de raw () o #html_safe aún no funcionó para mí.

Estoy usando un método auxiliar para crear un botón para marcar el contenido. Terminé usando lo siguiente en mi método de ayuda (la ruta se define de antemano):

form_tag path, :method => :post do
  button_tag do
    content_tag :i, ''Flag as inappropriate'', :class => ''icon-flag flag_content''
  end
end

Answer 2

Este trabajo para mí, (y con mensaje de confirmación)

<%= 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%>

esto genera

<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>

Answer 3

Estoy usando este ayudante:

module ApplicationHelper
  def glyph(*names)
   content_tag :i, nil, class: names.map{|name| "icon-#{name.to_s.gsub(''_'',''-'')}" }
  end
end

Ejemplo:

glyph(:share_alt)
=> <i class="icon-share-alt"></i>

y

glyph(:lock, :white)
=> <i class="icon-lock icon-white"></i>

Answer 4

No estoy seguro de cómo funcionó esto el OP, pero Rails button_to genera un elemento <input type=''submit'' /> , que no permite HTML en el campo de valor.

Ver también: input type = "submit" La etiqueta del botón Vs son intercambiables?

La mejor alternativa en esta situación es forzar link_to a PUT (o 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 %>

Answer 5

Parece que tienes un problema con tus citas:

<%= button_to raw("<i class=/"icon-search icon-white/">Add To Cart</i>"), 
          line_items_path(product_id: product), 
          class: "btn btn-success" %>

Encierre la etiqueta del botón entre comillas dobles, evite las comillas dobles en su etiqueta i , y finalmente, envuelva todo en una llamada en raw() para asegurarse de que el HTML se muestre correctamente.

Alternativamente puedes usar 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" %>

buen punto de @jordanpg: no puede tener HTML en el valor de un botón, por lo que su solución es más apropiada y debería obtener el estado aprobado. Sin html_safe parte html_safe sigue siendo válida.

Answer 6

Puedes añadir el icono como elemento hijo:

<%= button_to button_path, method: :delete do %>
    <span class="glyphicon glyphicon-search"></span>
<% end %>

Answer 7

Usando Rails 4 y Bootstrap 3, aquí se explica cómo crear un botón de eliminación usando link_to o button_to .

Tenga en cuenta que estoy usando Haml lugar de Erb.

En su opinión:

- @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}?" }

También puede reemplazar la parte content_tag con

raw(''<i class="glyphicon glyphicon-trash"> Delete</i>''),

Answer 8

Utilicé este y funciona bien para mí:

<%= 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 %>

Espero que esto ayude