Ruby Forum Ruby on Rails > button_to with an image

Hi, is that possible?

I have tried many things but each of them failed. I saw there was once a
patch available some time ago, was it included in Rails?

Do you want a button or an image? If you want an image, you

link_to image_tag(...), ...

Jason

On Thu, May 8, 2008 at 2:27 PM, Fernando Perez

I want both.

Instead of having an ugly button, I want to display my very own image.

On Thu, May 8, 2008 at 12:08 PM, Fernando Perez
<rails-mailing-list@andreas-s.net> wrote:

> Instead of having an ugly button, I want to display my very own image.

Use CSS to style the button, with your image as background.

FWIW,
--
Hassan Schroeder ------------------------ hassan.schroeder@gmail.com

On Thu, May 8, 2008 at 3:34 PM, Hassan Schroeder
<hassan.schroeder@gmail.com> wrote:
> Hassan Schroeder ------------------------ hassan.schroeder@gmail.com
>
> >
>

Styling form elements like buttons isn't cross-platform portable. It
flat out doesn't work in IE 6 or below, I'm not sure of the
capabilities of IE 7. Works fine in Firefox / Safari, so if that's all
you care about then have at it.

Jason

What I want is to be able to generate html code that looks like this 
using the button_to (or other means) helper:

<input type="image" src="images/submit.jpg" value="Submit" alt="Submit">

There is no need for css. I can't just type raw html, as I need the 
authenticity token to be created too as data is being POSTed to the 
server.

image_submit_tag

http://api.rubyonrails.org/classes/ActionView/Helpers/FormTagHelper.html#M001046

Jason

On Thu, May 8, 2008 at 4:07 PM, Fernando Perez

This means I have to use the form_tag also.

But I think it is the only way to do it though. It is really strange 
that the Rails team didn't think about that option for the button_to 
helper.

On Thu, May 8, 2008 at 2:25 PM, Fernando Perez
<rails-mailing-list@andreas-s.net> wrote:
>
> This means I have to use the form_tag also.
>
> But I think it is the only way to do it though.

Or use the code from button_to to make your own image_button_to
method in application_helper.rb; it really only amounts to changing
this line:

        html_options.merge!("type" => "submit", "value" => name)

to something like

        html_options.merge!("type" => "image", "src" => "/button.png",
"alt" => "go",  "value" => name)

Assuming you don't want to patch the source itself to accept the
additional parameters....

FWIW,
--
Hassan Schroeder ------------------------ hassan.schroeder@gmail.com

On May 8, 12:08 pm, Fernando Perez <rails-mailing-l...@andreas-s.net>
wrote:
> I want both.
>
> Instead of having an ugly button, I want to display my very own image.
> --
> Posted via http://www.ruby-forum.com/.

I had a similar goal -- to build something like this:
http://particletree.com/features/rediscovering-the-button-element/
page down to "the heading "The Result" where it shows a Login button,
a Change Password link and a Cancel link.

I came up with two helpers:
  #
  # <button type="submit" class="button positive">
  #    <img src="/stylesheets/blueprint/plugins/buttons/icons/key.png"
alt=""/> Sign Up
  # </button>
  #
  def button_tag(name, icon, options={})
    icon_path = '/stylesheets/blueprint/plugins/buttons/icons/'
    icon_path += icon
    img = tag("img", :src => icon_path,
                     :alt =>"", :open => false)
    img << ' ' + name
    options.merge!("type" => 'submit') unless options[:type]
    content_tag(:button, img, options)
  end

  #
  #  <a class="button negative" href="/">
  #     <img src="/stylesheets/blueprint/plugins/buttons/icons/
cross.png" alt=""/> Cancel
  #  </a>
  #
  def img_link_tag(name, icon, options={})
    icon_path = '/stylesheets/blueprint/plugins/buttons/icons/'
    icon_path += icon
    img = tag("img", :src => icon_path,
                     :alt =>"", :open => false)
    img << ' ' + name
    options.merge!(:href => 'root') unless options[:href]
    content_tag(:a, img, options)
  end

 Usage: in my login form
    <fieldset class="submit">
        <%= button_tag 'Login', 'key.png', :class => 'button positive'
%>
        <%= img_link_tag 'Cancel', 'cross.png', :href => '/', :class
=> 'button negative' %>
    </fieldset>

Fernando Perez wrote:
> This means I have to use the form_tag also.
> 
> But I think it is the only way to do it though. It is really strange 
> that the Rails team didn't think about that option for the button_to 
> helper.

If its useful, and its not already in rails, then create a patch for it,
http://rails.lighthouseapp.com

next time someone needs the functionality, they'll say;
"isn't rails great, they even thought of this circumstance"

if noone ever adds it, it'll never get added.