Forum: Ruby on Rails Newbie: Hide div I've just show using link_to_remote?

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
87e4363c61cea7fd62feee2dfcddc93a?d=identicon&s=25 Nick Coyne (nick)
on 2006-04-26 15:43
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 %>
<div class="rowFormat">
<%= link_to_remote( "#{task.title}",
                   :update => "task_#{task.id}",
                   :url =>{:controller => 'front/tasks', :action =>
'show', :id => task} )%>
</div>
<div id="task_<%=task.id%>"></div>
<% end %>
0900e6a4828bd989f96427082c6c74ca?d=identicon&s=25 Mike Garey (random52k)
on 2006-04-26 16:48
(Received via mailing list)
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
4daf0b71d5d9a3882e583c0e72eaf5dc?d=identicon&s=25 Alan Francis (Guest)
on 2006-04-26 16:59
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.
87e4363c61cea7fd62feee2dfcddc93a?d=identicon&s=25 Nick Coyne (nick)
on 2006-04-26 17:08
Mike Garey 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!
87e4363c61cea7fd62feee2dfcddc93a?d=identicon&s=25 Nick Coyne (nick)
on 2006-04-26 17:14
Alan Francis 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.
0900e6a4828bd989f96427082c6c74ca?d=identicon&s=25 Mike Garey (random52k)
on 2006-04-26 17:35
(Received via mailing list)
On 4/26/06, Nick Coyne <nic@nickcoyne.com> wrote:
>
> Alan Francis 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:

<div 'list' style="display:inline">
my list
</div>

<%= 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
87e4363c61cea7fd62feee2dfcddc93a?d=identicon&s=25 Nick Coyne (nick)
on 2006-04-26 17:44
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%>"></div>

And my page that provides the content has a "Hide" link that looks like:
<a onClick="new
Effect.BlindUp('task_<%=@task.id%>',{duration:0.5})">Hide</a>

Works great! Thanks Mike and Alan!

Mike Garey wrote:
> On 4/26/06, Nick Coyne <nic@nickcoyne.com> wrote:
>>
>> Alan Francis 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:
>
> <div 'list' style="display:inline">
> my list
> </div>
>
> <%= 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
E6b040ecc51de500ee5a6f83aa3adc68?d=identicon&s=25 Kfir Lavi (Guest)
on 2006-04-26 18:10
(Received via mailing list)
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
2eefe18cc202b70c1391e3546a191d44?d=identicon&s=25 mixplate (Guest)
on 2006-12-07 15:44
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
This topic is locked and can not be replied to.