Adding a submit button image to a Rails form

问题:

I'm creating a form in Rails for submitting comments, and I want the submit button to be an image, rather than an HTML button. In this bit of documentation, it says the code is image_submit_tag, but I can't get it to work in my code.

Here's what I'm working with:

<% form_for [@post, Comment.new], :remote => true do |f| %> <p>     <%= f.label :body, "Add a comment" %><br />     Name <%= f.text_field :name %><br />     Website<%= f.text_field :website %><br />     Twitter<%= f.text_field :twitter %><br />     <%= f.text_area :body %> </p> <div id="comment-form">      <div id="comment-button"><p>         <%= f.image_submit_tag("comment-button.png") %></p>         </div> </div> <% end %> 

Thanks for the help.

回答1:

You can do it like so:

ERB:

<%= f.submit "" %> 

CSS:

input[type="submit"] {   background:url(mybutton.png); } 

回答2:

I just fell over this one, trying to solve the same problem. A sudden thought made me just try something like this:

<%= f.submit "Comment", :type => :image, :src => "/images/comment-button.png" %> 

Will create something like this:

<input id="comment_submit" name="commit" src="/images/comment-button.png" type="image" value="Comment" /> 

Try it out :-)

回答3:

I believe the 'tag' methods cannot be called on the form builder object.

By 'tag' methods I mean things from the ActionView::Helpers::FormTagHelper module.

It should work if you do:

<div id="comment-button"><p>   <%= image_submit_tag("comment-button.png") %></p> </div> 

回答4:

Working from Zabba's example a more accessible solution would be:

View:

<%= f.submit "Submit" %> 

CSS:

input[type="submit"] {   background:url(mybutton.png);   text-indent: -9999em; } 

回答5:

Yup, the following should work:

  <%= image_submit_tag("comment-button.png") %></p> 

http://apidock.com/rails/ActionView/Helpers/FormTagHelper/image_submit_tag

回答6:

Please using delete on line:

<%= f.image_submit_tag("/assets/icon-search.png") %> 

change into:

<%= image_submit_tag("/assets/icon-search.png") %> 

more details on image_submit_tag

回答7:

For rails 3.1 and above

<%= f.submit "Submit", :type => :image, :src => image_path("submit.png") %> 

文章来源: Adding a submit button image to a Rails form