Not getting the whole RJS-based partial rendering concept

Rails
1

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

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

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

  1. 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

2

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

3

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 R. 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

4

Andrew C. 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

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

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

  1. 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:

<%= 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'" %>
<%= link_to_remote "Clear tables", :url =>{ :action => :remove_stuff }, :after => "Element.hide('clear_linkdiv'); Element.show('add_linkdiv'" %>
5

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

6

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 C. 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

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

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

  1. 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:

<%= 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'" %>
<%= link_to_remote "Clear tables", :url =>{ :action => :remove_stuff }, :after => "Element.hide('clear_linkdiv'); Element.show('add_linkdiv'" %>
7

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 C. 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! :slight_smile:
Andy

8

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! :slight_smile:
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