Forum: Ruby on Rails Not getting the whole RJS-based partial rendering concept ..

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.
Af1ee2208795752559b049502ded660c?d=identicon&s=25 Andrew Cowan (k2mia)
on 2006-04-04 20:06
(Received via mailing list)
I have been trying all kinds of different ways to produce what I think
should be a simple effect, but have not had any luck yet and apparently
I am not following the general idea...

What I am trying to accomplish is the following (part 1 works and part 2
does not):

1. One of my views has a link_to_remote which updates a div container
with a table of data

my example is

<div id="linkdiv">
<%= link_to_remote( "(display stuff)",
                    :update => "div_for_stuff",
                    :url => "/stuff/do_stuff" ) %>
</div>

<div id="div_for_stuff">
</div>

This works, the page adjusts and the table appears in div_for_stuff

2. At the point where the table appears I would like for the above link
to be replaced with a link to clear the table.

I have tried all manner of aproaches for this and just don't get it, I
have the link_to in its own div container and have tried using a
page.replace_html but the div container does not change.

eg
<%
   render :update do |page|
      page.replace_html 'linkdiv', :partial => "do_clear"
   end
%>

in _do_clear.rhtml I have a new link_to which never appears.

I'm confused, can anyone take pity on me and point me to some actual
working code that might do this sort of thing?

Thanks in advance for any help you can provide
-Andy
0091f92762685860109bbcb02edfdf27?d=identicon&s=25 Alain Ravet (Guest)
on 2006-04-04 20:24
(Received via mailing list)
Andrew

    > 2. At the point where the table appears I would like for the above
link
    > to be replaced with a link to clear the table.

I would rather
   1/ place the 2 links in the original html,
   2/ hide the 2nd link (clear_the_table) with
               style="display:none"
and then
   3/ hide the first link, and show the 2nd - clear_the_table - link.

When applicable, I find this way simpler to code, understand and debug.

Alain
Af1ee2208795752559b049502ded660c?d=identicon&s=25 Andrew Cowan (k2mia)
on 2006-04-04 21:04
Thank you Alain, I am not at all opposed to hiding one link and
displaying the other ( I assume you mean having a div container for each
and setting the appropriate style )

Unfortunately, the problem remains for me that I still do not know how
to modify those style attributes from the action that gets called via
the first link, I still have not had any success doing a
page.replace_html, or know if that is even the right approach.

Thanks!
-Andy


Alain Ravet wrote:
> Andrew
>
>     > 2. At the point where the table appears I would like for the above
> link
>     > to be replaced with a link to clear the table.
>
> I would rather
>    1/ place the 2 links in the original html,
>    2/ hide the 2nd link (clear_the_table) with
>                style="display:none"
> and then
>    3/ hide the first link, and show the 2nd - clear_the_table - link.
>
> When applicable, I find this way simpler to code, understand and debug.
>
> Alain
80ff4e1611003fcdc3c8dc99d21ec1cb?d=identicon&s=25 BobFunk (Guest)
on 2006-04-04 21:30
Andrew Cowan wrote:
> I have been trying all kinds of different ways to produce what I think
> should be a simple effect, but have not had any luck yet and apparently
> I am not following the general idea...
>
> What I am trying to accomplish is the following (part 1 works and part 2
> does not):
>
> 1. One of my views has a link_to_remote which updates a div container
> with a table of data
>
> my example is
>
> <div id="linkdiv">
> <%= link_to_remote( "(display stuff)",
>                     :update => "div_for_stuff",
>                     :url => "/stuff/do_stuff" ) %>
> </div>
>
> <div id="div_for_stuff">
> </div>
>
> This works, the page adjusts and the table appears in div_for_stuff
>
> 2. At the point where the table appears I would like for the above link
> to be replaced with a link to clear the table.
>
> I have tried all manner of aproaches for this and just don't get it, I
> have the link_to in its own div container and have tried using a
> page.replace_html but the div container does not change.
>
> eg
> <%
>    render :update do |page|
>       page.replace_html 'linkdiv', :partial => "do_clear"
>    end
> %>
>
> in _do_clear.rhtml I have a new link_to which never appears.
>
> I'm confused, can anyone take pity on me and point me to some actual
> working code that might do this sort of thing?
>
> Thanks in advance for any help you can provide
> -Andy

Did something quite similar a moment ago, I think something like this
should work:

<div id="add_linkdiv">
        <%= link_to_remote "Load tables",
	          :url =>{ :action => :add_stuff },
			  :loading => "Element.update('header','Loading...')",
			  :success => "Element.update('header','Stuff loaded')",
			  :after => "Element.hide('add_linkdiv');
Element.show('clear_linkdiv'" %>
</div>

<div id="clear_linkdiv">
        <%= link_to_remote "Clear tables",
	          :url =>{ :action => :remove_stuff },
			  :after => "Element.hide('clear_linkdiv');
Element.show('add_linkdiv'" %>
</div>
Af1ee2208795752559b049502ded660c?d=identicon&s=25 Andrew Cowan (k2mia)
on 2006-04-04 21:48
This would be great, however I am getting parse errors.

have this:

<%= link_to_remote( "(display)",
                    :update => "div_1",
                    :url => { :action => "inline_list", :id => entry.id
},
                    :after => Element.hide('linkdiv_show') %>

The error is:

parse error, unexpected ';', expecting ')'

I also tried putting double-quotes around the Element.hide() as in your
example but I get the same error.

Any ideas?

Thanks,
Andy


BobFunk wrote:
> Andrew Cowan wrote:
>> I have been trying all kinds of different ways to produce what I think
>> should be a simple effect, but have not had any luck yet and apparently
>> I am not following the general idea...
>>
>> What I am trying to accomplish is the following (part 1 works and part 2
>> does not):
>>
>> 1. One of my views has a link_to_remote which updates a div container
>> with a table of data
>>
>> my example is
>>
>> <div id="linkdiv">
>> <%= link_to_remote( "(display stuff)",
>>                     :update => "div_for_stuff",
>>                     :url => "/stuff/do_stuff" ) %>
>> </div>
>>
>> <div id="div_for_stuff">
>> </div>
>>
>> This works, the page adjusts and the table appears in div_for_stuff
>>
>> 2. At the point where the table appears I would like for the above link
>> to be replaced with a link to clear the table.
>>
>> I have tried all manner of aproaches for this and just don't get it, I
>> have the link_to in its own div container and have tried using a
>> page.replace_html but the div container does not change.
>>
>> eg
>> <%
>>    render :update do |page|
>>       page.replace_html 'linkdiv', :partial => "do_clear"
>>    end
>> %>
>>
>> in _do_clear.rhtml I have a new link_to which never appears.
>>
>> I'm confused, can anyone take pity on me and point me to some actual
>> working code that might do this sort of thing?
>>
>> Thanks in advance for any help you can provide
>> -Andy
>
> Did something quite similar a moment ago, I think something like this
> should work:
>
> <div id="add_linkdiv">
>         <%= link_to_remote "Load tables",
> 	          :url =>{ :action => :add_stuff },
> 			  :loading => "Element.update('header','Loading...')",
> 			  :success => "Element.update('header','Stuff loaded')",
> 			  :after => "Element.hide('add_linkdiv');
> Element.show('clear_linkdiv'" %>
> </div>
>
> <div id="clear_linkdiv">
>         <%= link_to_remote "Clear tables",
> 	          :url =>{ :action => :remove_stuff },
> 			  :after => "Element.hide('clear_linkdiv');
> Element.show('add_linkdiv'" %>
> </div>
694d815d0495d7dafb36aff6a0942595?d=identicon&s=25 Peter (Guest)
on 2006-04-04 22:02
<%= link_to_remote( "(display)",
                    :url => { :action => "inline_list", :id => entry.id
}
%>
loose the :update (doesn't work in RJS)

rjs file bij default 'inline_list.rjs'

in youre method you have the instance vars of course

then build youre rjs file

page.hide 'old_div'
page.replace_html 'other_div', :partial => 'whatever'
page.visual_effect :appear, 'other_div'

or use it in the method in the controller

render :update do |page|
  page.hide 'old_div'
  page.replace_html 'other_div', :partial => 'whatever'
  page.visual_effect :appear, 'other_div'
end
Af1ee2208795752559b049502ded660c?d=identicon&s=25 Andrew Cowan (k2mia)
on 2006-04-04 23:26
Excellent, this showed me a few things I was doing wrong and I am able
to get the display and hide links working now in a simplified fashion,
still have one small hurdle.

The div tag ids I am using are based on the id# for the data items, so I
have the following tags:

linkdiv_1_show
linkdiv_1_hide
commentsdiv_1

eg where 1 is the id # for the specific item.

In the .rjs files I am trying to recreate the correct div tag ids but
its complaining, I'm sure I am missing the syntax since all of the
examples I have seen from the api/docs show static div ids.

eg

page['clinkdiv_#{@eid}_show'].hide

where @eid is defined in the controller, but I get this error:


TypeError: $("clinkdiv_#{@eid}_show") has no properties


Is there not a way to access that @eid from the .rjs file and use it in
a div id?

Thank you guys so much, I'm much closer to understanding all of this! :)
Andy



Peter wrote:
> <%= link_to_remote( "(display)",
>                     :url => { :action => "inline_list", :id => entry.id
> }
> %>
> loose the :update (doesn't work in RJS)
>
> rjs file bij default 'inline_list.rjs'
>
> in youre method you have the instance vars of course
>
> then build youre rjs file
>
> page.hide 'old_div'
> page.replace_html 'other_div', :partial => 'whatever'
> page.visual_effect :appear, 'other_div'
>
> or use it in the method in the controller
>
> render :update do |page|
>   page.hide 'old_div'
>   page.replace_html 'other_div', :partial => 'whatever'
>   page.visual_effect :appear, 'other_div'
> end
Af1ee2208795752559b049502ded660c?d=identicon&s=25 Andrew Cowan (k2mia)
on 2006-04-04 23:55
Disregard that last message, if I had just tried a set of "s instead of
's I'd have found the answer -- thanks again for all your help!

-Andy


Andrew Cowan wrote:
> Excellent, this showed me a few things I was doing wrong and I am able
> to get the display and hide links working now in a simplified fashion,
> still have one small hurdle.
>
> The div tag ids I am using are based on the id# for the data items, so I
> have the following tags:
>
> linkdiv_1_show
> linkdiv_1_hide
> commentsdiv_1
>
> eg where 1 is the id # for the specific item.
>
> In the .rjs files I am trying to recreate the correct div tag ids but
> its complaining, I'm sure I am missing the syntax since all of the
> examples I have seen from the api/docs show static div ids.
>
> eg
>
> page['clinkdiv_#{@eid}_show'].hide
>
> where @eid is defined in the controller, but I get this error:
>
>
> TypeError: $("clinkdiv_#{@eid}_show") has no properties
>
>
> Is there not a way to access that @eid from the .rjs file and use it in
> a div id?
>
> Thank you guys so much, I'm much closer to understanding all of this! :)
> Andy
This topic is locked and can not be replied to.