Replace content in a div on prototype observe_field update?

rubyonrails-talk
1

For:

<%= observe_field :division_filter_id,          :frequency => 0.5,          :update => 'ajaxJobListWrapper',          :url => {:action => 'update_job_list' },          :with => 'division_id',          :position => :top %>

where ajaxJobListWrapper is a div and update_job_list renders a partial, is there any way to REPLACE the current ajaxJobListWrapper div content by the content returned by the update_job_list action?

The content returned by update_job_list as used above places the returned content above the existing content. I would like to replace it. I've tried all of the positions. Any ideas on an approach for how to do this?

Thanks.

2

Hi athem,

athem wrote:

<%= observe_field :division_filter_id,          :frequency => 0.5,          :update => 'ajaxJobListWrapper',          :url => {:action => 'update_job_list' },          :with => 'division_id',          :position => :top %>

where ajaxJobListWrapper is a div and update_job_list renders a partial, is there any way to REPLACE the current ajaxJobListWrapper div content by the content returned by the update_job_list action?

Use page.replace in an RJS template rather than the :update option on observe_field. I highly recommend Cody Fauser's PDF on O'Reilly, 'RJS Templates'. Ten bucks well spent.

HTH, Bill

3

Thanks very much for the tip on Cody Fauser's PDF on RJS Templates. Using the following in list.rhtml to observe a dropdown listbox:

<%= observe_field :division_filter_id,              :frequency => 0.5,              :url => {:action => 'update_job_list' },              :with => 'division_id' %>

and the div I'm trying to replace (it renders the partial when list.rhtml is first displayed)

<div id='ajaxJobListWrapper'>     <%= render :partial=>'job_listings' %> </div>

I tried using:

page.replace_html 'ajaxJobListWrapper', :partial => 'job_listings'

in update_job_list.rjs, but had the same problem: the content returned from the partial job_listings appeared is added to the existing content (instead of the select filtering the list, when clicked, content is added).

When I tried using:

page.replace 'ajaxJobListWrapper', :partial => 'job_listings'

this seems correct (it would seem that the content of the div needs to be REPLACED in the DOM), but triggers the following RJS error:

TypeError: Element.replace is not a function

I don't expect to have my code debugged here, but I'm completely new to RJS and thought I might have misunderstood the advice given above. Any advice on this error would be appreciated. I need to dig more deeply into RJS. Thanks for everyone's help.