# Newbie: Hide div I've just show using link\_to\_remote?

**URL:** <https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847>\
**Category:** Rails\
**Created:** [April 26, 2006, 3:43pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847 "2006-04-26T15:43:51Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [April 26, 2006, 3:43pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/1 "2006-04-26T15:43:51Z")

</div>

I’m using link\_to\_remote to show details for an item that’s clicked. I’d  
like to hide the div with the next click, or alternatively have a “Hide”  
link within my div.

What is the best way to accomplish this?

Here’s my existing code:

\<% for task in @mytasks %\>

\<%= link\_to\_remote( "#{task.title}", :update =\> "task\_#{task.id}", :url =\>{:controller =\> 'front/tasks', :action =\> 'show', :id =\> task} )%\>

\<% end %\>

---

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [April 26, 2006, 4:48pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/2 "2006-04-26T16:48:23Z")

</div>

why not use Element.toggle?

\<%= link\_to\_remote(“Toggle List”, :after =\> “Element.toggle(‘list’)”) %\>

the above will display the element with id ‘list’ if it’s hidden, and  
hide  
it if it’s shown.

Mike

---

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [April 26, 2006, 4:59pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/3 "2006-04-26T16:59:53Z")

</div>

Just to add to Mike’s post, I’d look at the standard rails index.html as  
it does that very thing with the about DIV.

A.

---

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [April 26, 2006, 5:08pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/4 "2006-04-26T17:08:17Z")

</div>

Mike G. wrote:

> why not use Element.toggle?
> 
> \<%= link\_to\_remote(“Toggle List”, :after =\> “Element.toggle(‘list’)”) %\>
> 
> the above will display the element with id ‘list’ if it’s hidden, and  
> hide  
> it if it’s shown.
> 
> Mike

That works great, except it only starts toggling after the 2nd click on  
the link. The first click does nothing.

My code now looks like this;  
\<%= link\_to\_remote( “#{task.title}”,  
:url =\>{:controller =\> ‘front/tasks’, :action =\> ‘show’, :id =\>  
task},  
:update =\> “task\_#{task.id}”,  
:after =\> “Element.toggle(‘task\_#{task.id}’)” )%\>

Thanks!

---

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [April 26, 2006, 5:14pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/5 "2006-04-26T17:14:33Z")

</div>

Alan F. wrote:

> Just to add to Mike’s post, I’d look at the standard rails index.html as  
> it does that very thing with the about DIV.
> 
> A.

That’s exactly what I want to do, but unfortunately the standard  
index.html doesn’t use rails to achieve its effect, it uses  
scriptaculous directly in a std html file.

---

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [April 26, 2006, 5:35pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/6 "2006-04-26T17:35:47Z")

</div>

On 4/26/06, Nick C. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid) wrote:

> Alan F. wrote:
> 
> > Just to add to Mike’s post, I’d look at the standard rails index.html as  
> > it does that very thing with the about DIV.
> > 
> > A.
> 
> That’s exactly what I want to do, but unfortunately the standard  
> index.html doesn’t use rails to achieve its effect, it uses  
> scriptaculous directly in a std html file.

maybe try setting the display css attribute of the div to inline, ie:

my list

\<%= link\_to\_remote(“Toggle List”, :after =\> “Element.toggle(‘list’)”) %\>

since Element.toggle simply changes the display attribute from ‘inline’  
to  
‘none’, so it may have a problem if you don’t initially set any display  
attribute.

Mike

---

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [April 26, 2006, 5:44pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/7 "2006-04-26T17:44:57Z")

</div>

Ok, got it to do what I want, the default index.html helped a bit.

My link now looks like:  
\<%= link\_to\_remote( “#{task.title}”,  
:url =\>{:controller =\> ‘front/tasks’, :action =\> ‘show’, :id =\>  
task},  
:update =\> “task\_#{task.id}”,  
:complete =\> visual\_effect(:BlindDown, “task\_#{task.id}”,  
:duration =\> 1))%\>

Couldn’t figure out how to do the blind effect with the toggle. Then my  
empty div looks like:  
\<divstyle=“display: none” id=“task\_\<%=task.id%\>”\>

And my page that provides the content has a “Hide” link that looks like:  
Hide

Works great! Thanks Mike and Alan!

Mike G. wrote:

> On 4/26/06, Nick C. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid) wrote:
> 
> > Alan F. wrote:
> > 
> > > Just to add to Mike’s post, I’d look at the standard rails index.html as  
> > > it does that very thing with the about DIV.
> > > 
> > > A.
> > 
> > That’s exactly what I want to do, but unfortunately the standard  
> > index.html doesn’t use rails to achieve its effect, it uses  
> > scriptaculous directly in a std html file.
> 
> maybe try setting the display css attribute of the div to inline, ie:
> 
> my list
> 
> \<%= link\_to\_remote(“Toggle List”, :after =\> “Element.toggle(‘list’)”) %\>
> 
> since Element.toggle simply changes the display attribute from ‘inline’  
> to  
> ‘none’, so it may have a problem if you don’t initially set any display  
> attribute.
> 
> Mike

---

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [April 26, 2006, 6:10pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/8 "2006-04-26T18:10:14Z")

</div>

I have the same problem showing div item that its initial state is set  
to ‘none’.  
It seems that when the initial state is ‘none’, Element.toggle can’t  
change it to ‘inline’.

what i did to solve the problem, is using the ‘onload’ event.  
I’m starting by showing the div and then when the page loads, it uses  
‘onload’ to switch to ‘none’, then the toggling works.

Is there a way not to use this hack?  
tnx  
Kfir

---

<div class="post-metadata">

**Author:** ![n1c](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/n/3ec8ea/32.png) [@n1c](https://www.ruby-forum.com/u/n1c)\
**Post date:** [December 7, 2006, 3:44pm UTC](https://www.ruby-forum.com/t/newbie-hide-div-ive-just-show-using-link-to-remote/58847/9 "2006-12-07T15:44:54Z")

</div>

im working on this problem also. actually i sort of stuck where i load a  
javascript behavior on :loading. i dont have the code in front of me,  
but its something like newEffect.Highlight(‘somediv’#{obj.id})

the updating of the div works but doesnt load the effect.

thanks