ruby-on-rails - popper - rails add bootstrap 4
Rieles y bootstrap-Agregar etiquetas HTML a un texto de botón de envío (7)
Tengo un formulario para un botón de Me gusta / a diferencia usando ajax:
= form_for like, :html => { :method => :delete}, :remote => true do |f|
= f.submit pluralize(@video.likes.count, ''like''), :class => "btn btn-warning btn-mini", "data-disable-with"=> "Just a moment..."
La forma funciona perfectamente.
Me gustaría agregar un ícono delante del texto en el botón enviar. El código Haml para agregar el ícono es el siguiente (inicio de Twitter):
%i.icon-heart.icon-white
¿Hay una manera de agregar este html al botón? Intenté agregarlo como html simple, pero los rieles lo representaron como texto.
ACTUALIZAR
Me las arreglé para encapsular el botón de envío en una clase de intervalo que contiene el icono y el estilo apropiado. Ahora necesito quitar todos los estilos en el botón ...
%span.btn.btn-danger.btn-mini
%i.icon-heart.icon-white
= f.submit pluralize(@video.likes.count, ''like'')
Gracias a Ismaelga, encontré esta pregunta SO .
Esta es la solución:
<%= button_tag(type: ''submit'', class: "btn btn-primary") do %>
<i class="icon-ok icon-white"></i> Save
<% end %>
La respuesta aceptada para la pregunta en sí funcionará, pero es más como un parche en lugar de la solución perfecta que mantiene el estilo de código claro y consistente. Retrocede en el uso del método de vista estándar y manual: #button_tag . Tiendo a evitar los métodos manuales como #submit_tag, #form_tag, #input_tag ... etc, ya que no están relacionados con el modelo respaldado o el modelo de formulario en sí, y usted necesita hacer todo manualmente en ellos. A pesar de que el envío no tiene conexión con la f. que cada entrada en form_for tiene como por ejemplo, f.input ... , se trata de estilo, legibilidad de código y buenas prácticas de programación. Este código funciona perfectamente bien (form_for y simple_form):
= f.button :button, type: :submit, class: ''class1 class2 ... classN'' do
= ''button call to action text''
%i.fa.fa-download.ml5 // => haml icon as requested
Espero que ayude a otros a llegar a este post como yo tratando de evitar los métodos de _tag .
La respuesta de Justin D también me ayudó. Si vienes aquí desde Google y estás buscando una implementación Slim, puedes hacerlo así:
= button_tag(type: ''submit'', class: ''btn btn-default'') do
span.glyphicon.glyphicon-floppy-disk>
| Save
end
Los usuarios delgados reconocerán la necesidad del > .
Esto me funcionó con Rails 4.1.5, Ruby 2.1.2 y bootstrap-sass 3.2 a partir del 24 de septiembre de 2014.
Otra opción podría ser button en lugar de submit
ver la documentación de Rails FormBuilder#button
= f.button :class => "btn btn-warning btn-mini" do
%i.icon-heart.icon-white
= pluralize(@video.likes.count, ''like'')
Por favor intente el siguiente código. Funciona
<%= f.submit :class => "btn btn-success btn-mini" %>
Prueba esto. No he probado, pero creo que es posible hacer algo como esto.
= f.submit :class => "btn btn-warning btn-mini", "data-disable-with"=> "Just a moment..." do
%i.icon-heart.icon-white
= pluralize(@video.likes.count, ''like'')
end
Así que esto era posible si usabas simple_form. Lo siento.
Así que otro intento sería
= f.submit "#{pluralize(@video.likes.count, ''like'')} <i class=''icon-heart icon-white''/>".html_safe, :class => "btn btn-warning btn-mini", "data-disable-with"=> "Just a moment..."
Solución
= button_to(''Add'', line_item_path, method: :post , class: "btn btn-warning btn-lg" , params: { param1: ''value1'', param2: ''value2'' })