est-il un moyen d'aide de la forme de rails pour produire une étiquette de bouton pour soumettre

Question

Je suis en train de créer des boutons ala Wufoo (Rediscovering the button element)

Je voudrais écrire le code suivant comme ce qui suit:

<%form_tag search_path, :method => :get, :class => 'search' do %> 
    <%=text_field_tag :search, params[:search] -%> 
    <%=button_tag 'search', :name => nil-%> 
<%end%> 

Pour générer le code HTML suivant (au lieu de l'entrée [type = "submit"] tag)

<button type="submit" class="positive"> 
    <img src="/images/icons/tick.png" alt=""/> 
    Save 
</button> 

Est-ce une méthode existe déjà? Ou devrais-je rouler ma propre aide?

Answer 1

Vous pouvez utiliser content_tag pour cela. C'est la façon la plus rocailleuse de faire ce que vous voulez. Mais c'est plus long que le HTML brut.

<% content_tag :button :type => :submit, :class => :positive do %> 
    <%= image_tag "icons/tick.png"%> 
    Save 
<% end %> 

qui produit

<button type="submit" class="positive"> 
    <img src="/images/icons/tick.png" alt="Tick"/> 
    Save 
</button> 

Cependant, l'utilisation comme point de départ, vous devriez avoir aucun problème roulant votre propre aide robuste, ou abstraire à une partielle.

Answer 2

Vous pouvez utiliser l'assistant image_submit_tag pour créer une image soumettre étiquette, plutôt que envelopper le tout dans un bouton:

<% 
image_submit_tag("login.png") 
# => <input src="/images/login.png" type="image" /> 

image_submit_tag("purchase.png", :disabled => true) 
# => <input disabled="disabled" src="/images/purchase.png" type="image" /> 

image_submit_tag("search.png", :class => 'search-button') 
# => <input class="search-button" src="/images/search.png" type="image" /> 
%> 

Cela pourrait ne pas être ce que vous cherchez, si vous avez besoin de la " Enregistrer "le texte doit apparaître au-dessus de <img>

Answer 3

Utilisez les tricheurs JQuery Gem https://github.com/plowdawg/jquery_cheats et à votre avis, il est juste

<%= submitimage("/path/to/image.png","Alternate Text") %> 

REMARQUE: texte alternatif est facultatif.