Using an image button for "link_to_remote"

Rails
1

All,

I want to do an AJAX request using a custom image button. I currently
have this as a standard button action using “button_to”.

What I need is the button equivalent of “link_to_remote”. Is there a
helper that I can use, or do I need to build it by hand?

I see button_to_function(), but that sets me up to call a Javascript
function, not post to a Rails action.

Or can I just do a link_to_remote and force it to be a POST?

Thanks,
Wes

2

Can I just call an RJS template which will update the AJAX target DIV
appropriately, so that I can still use button_to for a regular target?

Wes

3

Looks like “button_to_function” and “remote_function” should do it?

4

Actually I ended up with two options to handle this (both should degrade
gracefully if I understand the :html option correctly).

  1. Put all of the AJAX-y ness into the submit button.
    <%= form_tag %>
    <%= submit_to_remote(‘upload_list’, ‘Upload a List’,
    :url => {:action => ‘target_list_upload_display’},
    :html => {:action => ‘target_list_upload’, :class
    => ‘additem’}) %>
    <%= end_form_tag %>

  2. Make the form handle the AJAX call and then use a regular submit tag.
    <%= form_remote_tag (:url => {:action => ‘target_list_upload_display’},
    :html => {:action => ‘target_list_upload’})%>
    <%= submit_tag(‘Upload a List’, :class => ‘additem’) %>
    <%= end_form_tag %>

I think I’m going to go with #1 just because everything is encapsulated
in the submit.

In this case, I think the solutions are interchangeable. Can anyone
give me a good reason to favor one over the other?

Thanks,
Wes

5

Doug D. wrote:

Wes, thank for posting answers to your questions!

It sounds you’ve gotten things under control, but for future references,
link_to_remote(“Submit”, {:method => :post, :url => {…}}). Actually, I
think it does a post by default.

Doug.

Doug,

You know, it’s funny - I had read the part of the link_to documentation
where it said that you could do a post. Sigh. This is much more
straightforward. I’ll give it a shot.

Thanks,
Wes

6

Wes, thank for posting answers to your questions!

It sounds you’ve gotten things under control, but for future references,
link_to_remote(“Submit”, {:method => :post, :url => {…}}). Actually, I
think it does a post by default.

Doug.

7

Doug,

This works well. However, I have a silly CSS question. I styled my
with display:block so that I could move it down a bit with margin-top.

Now, when I click it, the whole element is surrounded by a border
(even though the style on the in my stylesheet is ‘none’.

Any ideas?

Thanks again,
Wes

8

Hi Wes,

Did you specify a style for all of the different states? This should
disable the border for all link states:

a:link, a:visited, a:active, a:hover {border: none;}

Tom

On 7/22/06, Wes G. [email protected] wrote:

Thanks again,
Wes

–
Posted via http://www.ruby-forum.com/.

Rails mailing list
[email protected]
http://lists.rubyonrails.org/mailman/listinfo/rails

–
Tom D.

http://atomgiant.com
http://gifthat.com

9

Weird, that doesn’t help.

I also notice if I switch my style so that’s it’s displayed as an
inline element, that the border shows up just around the as well.
What gives?

wg

10

Duh - that’s why.

This is an AJAX call, and so the page isn’t refreshing. The border
always shows up around a button when you click it, but the page isn’t
being refreshed to restore the original link look and feel.

Luckily, I already have an RJS page to handle this :).

Wes

11

Got it!

In order to avoid the irritating “image border after link clicked”
effect lingering, you have to effectively refresh the anchor display,
which you can do by refactoring just the anchor into a partial,
enclosing it in a div, and then doing a replace_html on the div. Like
so:

View:

<%= render(:partial => 'upload_link') %>

(_upload_link.rhtml has the anchor tag display inside of it)

RJS:
page[:upload_link_container].replace_html :partial => ‘upload_link’

Very nice.

RJS - powerful magic.

Also, much thanks to RailsWeenie for this debugging script:
http://rails.techno-weenie.net/tip/2005/12/20/debugging_your_rjs_calls

It is invaluable.

Wes