Newbie: Hide div I've just show using link_to_remote?

Rails
1

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 %>
2

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

3

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.

4

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!

5

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.

6

On 4/26/06, Nick C. [email protected] 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

7

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. [email protected] 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

8

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

9

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