# Link\_to\_remote image toggle

**URL:** <https://www.ruby-forum.com/t/link-to-remote-image-toggle/179842>\
**Category:** Rails\
**Created:** [December 5, 2009, 2:36am UTC](https://www.ruby-forum.com/t/link-to-remote-image-toggle/179842 "2009-12-05T02:36:26Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![charley](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/97f17d/32.png) [@charley](https://www.ruby-forum.com/u/charley)\
**Post date:** [December 5, 2009, 2:36am UTC](https://www.ruby-forum.com/t/link-to-remote-image-toggle/179842/1 "2009-12-05T02:36:26Z")

</div>

Wondering the best way to have a link that is an image, user clicks it,  
a controller is pinged, the image is flipped for another image. If the  
second image is clicked vice-versa etc. Just turning something on/off  
basically.

Here’s what I’ve got:

======================

\<%= link\_to\_remote (image\_tag("/images/icons/icon\_unfan.png"),  
:url =\> { :controller =\> “fanships”, :action =\> “toggle\_fanship”,  
:artist\_id =\> artist.id },  
:update =\> “need to switch image here” %\>

======================

def toggle\_fanship  
render :template =\> false  
@user = current\_user  
@artist = Artist.find(params[:artist\_id])  
if @artist.has\_fan(@user)  
destroy  
else  
create  
end  
end

======================

Unfortunately, it’s still looking for a toggle\_fanship template? Anyone  
know how to simple switch the image?

---

<div class="post-metadata">

**Author:** ![charley](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/97f17d/32.png) [@charley](https://www.ruby-forum.com/u/charley)\
**Post date:** [December 7, 2009, 10:06am UTC](https://www.ruby-forum.com/t/link-to-remote-image-toggle/179842/2 "2009-12-07T10:06:28Z")

</div>

Hi Charley Hine

You can do like

\<%= link\_to\_remote (image\_tag("/images/icons/icon\_unfan.png",:id =\> "image\_id",:alt =\> 'unfan\_image'), :url =\> {:controller =\> "fanships", :action =\> "toggle\_fanship", :artist\_id =\> artist.id } ) %\>

Now you do what ever you do in controller. Then create  
toggle\_fanship.js.rjs in app/views/fanships folder and write the  
following to it

page \<\< “if($(‘image\_id’).alt == ‘unfan\_image’){”  
page.replace\_html ‘image\_link\_div’, :inline =\> “\<%= link\_to\_remote  
(image\_tag(’/images/icons/icon\_fan.png’,:id =\> ‘image\_id’,:alt =\>  
‘fan\_image’), :url =\> {:controller =\> “fanships”, :action =\>  
“toggle\_fanship”, :artist\_id =\> artist.id } ) %\>”  
page \<\< “}”  
page \<\< “else{”  
page.replace\_html ‘image\_link\_div’, :inline =\> “\<%= link\_to\_remote  
(image\_tag(”/images/icons/icon\_unfan.png",:id =\> “image\_id”,:alt =\>  
‘unfan\_image’), :url =\> {:controller =\> “fanships”, :action =\>  
“toggle\_fanship”, :artist\_id =\> artist.id } ) %\>  
"  
page \<\< “}”

```
     Here I am assuming your icons are icon_fan.png and 

```

icon\_unfan.png…Please modify the above code according to your needs

Sijo