newbie question:partial refresh of page after onchange event

I want to use a dropdown box to select sales orders (by ordernumber). After selection of an order number, the screen must be partially refreshed and show the details of the sales order. I know that I have to use the collection_select method with the 'onchange' option (collection_select(:salesorder, :ordernr, Salesorder.find(:all), :ordernr, :ordernr, {:prompt => "– Select an order number –"}, {:onchange =>

The big question is: what comes after the onchange? I probably have to use a partial render?

Egon Rijk wrote:

I want to use a dropdown box to select sales orders (by ordernumber). After selection of an order number, the screen must be partially refreshed and show the details of the sales order. I know that I have to use the collection_select method with the 'onchange' option (collection_select(:salesorder, :ordernr, Salesorder.find(:all), :ordernr, :ordernr, {:prompt => "– Select an order number –"}, {:onchange =>

The big question is: what comes after the onchange? I probably have to use a partial render?

you can't use a partial here, since your code is run in the browser (javascript) so there are two ways to do it:

- write it in ajax, then your code would have to call an action, which in turn can render the partial and return it to update parts of the page - when creating the page, throw in the whole information, only hidden and show it with javascript

the first approach is by far better, the second one would only work, if there's only a limited amount of data

Thorsten Mueller wrote:

Egon Rijk wrote:

I want to use a dropdown box to select sales orders (by ordernumber). After selection of an order number, the screen must be partially refreshed and show the details of the sales order. I know that I have to use the collection_select method with the 'onchange' option (collection_select(:salesorder, :ordernr, Salesorder.find(:all), :ordernr, :ordernr, {:prompt => "– Select an order number –"}, {:onchange =>

The big question is: what comes after the onchange? I probably have to use a partial render?

you can't use a partial here, since your code is run in the browser (javascript) so there are two ways to do it:

- write it in ajax, then your code would have to call an action, which in turn can render the partial and return it to update parts of the page - when creating the page, throw in the whole information, only hidden and show it with javascript

the first approach is by far better, the second one would only work, if there's only a limited amount of data

You can do this by calling remote function and using the observe_field helper w/out specifying frequency (forces it to use onChange event):

i.e.

<% remote_function :url => {:action => 'get_sales_order_details'} %> <%= collection_select :salesorder, :ordernr, Salesorder.find(:all),    :ordernr, :ordernr, {:prompt => "– Select an order number –"}, {} %> <% observe_field :ordernr,     :url => {:action => 'get_sales_order_details'},     :with => :ordernr %>

In your controller you want define the get_sales_order_details function...

def get_sales_order_details   @sales_order = SalesOrders.find(params[:id])   render :update do |page|     page.replace_html "order_details", :partial => 'sales_order_details'   end end

...where "order_details" is the section of code in your main form (using <div id="order_details></div> tags) to be replace with the partial (which I called 'sales_order_details').

Hope this helps.

Brian,

I had to change your code here and there to make it work, but I finally managed. Thank you for putting me on the right track!

To help other newbies, here follows the final code:

In the view: <% remote_function :url => {:action => 'get_sales_order_details'} %> <%= collection_select(:salesorder, :ordernr, Salesorder.find(:all),    :ordernr, :ordernr, {:prompt => "– Select an order number –"}, {:id => 'ordernr_selected'}) %> <%= observe_field 'ordernr_selected',     :url => {:action => 'get_sales_order_details'},     :with => 'ordernr' %>

And in the controller:   def get_sales_order_details     @salesorder = Salesorder.find_by_ordernr(params[:ordernr])     render :update do |page|       page.replace_html "order_details", :partial => 'sales_order_details'     end   end

Note that I use 'find_by_ordernr(params[:ordernr])' i.s.o. 'find(params[:id])', since I don't have the :id field in my table. The primary key here is the ordernr.

Brian Penrose wrote:

Look at replace_html:

http://api.rubyonrails.org/classes/ActionView/Helpers/PrototypeHelper/JavaScriptGenerator/GeneratorMethods.html#M000978

Egon Rijk, your code has been very helpful.

I am trying to implement it, but am getting unexpected results. Any guidance you have would be appreciated.

Firebug gives me this error:

element has no properties [Break on this error] var method = element.tagName.toLowerCase();

In my view:

<%= f.collection_select (:state_code, StateList.find(:all, :order => "state ASC", :select => 'distinct state, state_code'), :state_code, :state, {:prompt => 'Select a State'}, {:id => :state_code }) %>

<div id="city_list"></div>

<%= observe_field 'state_list_state_code',     :url => {:action => 'get_city_list'},     :with => 'state_code' %>

In my controller:

  def get_city_list     @counties = StateList.find_by_state_code(params[:state_code])     render :update do |page|       page.replace_html "order_details", :partial => 'city_list'     end   end

THANKS!

Becca Girl wrote: One correction to the above code @counties is @cities.

Corrected method below.