Ajax request on page load

Rails
1

I’m trying to do something rather simple (I think) but being new to
rails, I’m not sure how I should proceed…

What I want to do in simple terms is: When the my page load, get some
data from a table (let’s call that table items)… so I want to get all
my items, and display them in a div… I want to do it via Ajax because
I want the user to be able to filter this data (live)…so the list of
items would update depending on what filter (a drop down menu) is
selected…

Now in PHP I would have no problems doing it with prototype… (a simple
ajax request with a “filter” parameter sent to a controller that will
return my list of items…)…then I update my div with this response…

Now in RoR…I tried to do it with a partial, and RJS templates but I
can’t get it to work…

What would be the easiest way to :

  1. When the page load, get the list of item…
  2. When the filter drop-down menu is changed, update that list of items
    based on what filter is selected…

Any help/tips would be appreciated…

2

For the onload part, just populate a variable in the controller and load
the items:

def index
@foos = Foo.find(:all)
end

You can then use an observe_field or observe_form in your page to watch
the drop down and fire off an ajax call and update the div from your
controller using rjs. The docs on observe_field / form are here:
http://api.rubyonrails.org/classes/ActionView/Helpers/PrototypeHelper.html#M000535

That should get you pointed in the right direction.

Jean-nicolas Jolivet wrote:

Now in PHP I would have no problems doing it with prototype… (a simple
2) When the filter drop-down menu is changed, update that list of items
based on what filter is selected…

Any help/tips would be appreciated…

–
Sincerely,

William P.

3

Thank you for your response! I wasn’t aware of the observe_field helper,
this will definitely help me :slight_smile:

The part where I’m kinda hesitant though is that I’m not sure where I
should generate my html (ex: should i do it in the controller? seems
like a weird place to do it…)

From what I understand, I can make an Ajax request when my select drop
down has changed, using the observe_field…

now let’s say I do it like this:

observe_field(‘my-dropdown’, :update => ‘my-items’, :url => {:controller
=> ‘items’, :action => ‘update_list’})

So this would call the update_list option of my items controller, and
update my div (‘my-items’) with the respone, whenever my-dropdown
changes…perfect…sounds just like what I need…

The question is… What do I put in the update_list action of my item
controller? To return a formatted html response that I can update my div
with? And when do RJS templates comes into play?

I’m a bit lost…

4

I would put the html in a partial. Remove the :update from your
observer_field method and to the update using rjs and a partial from the
controller. Here is a mock-up to give you an idea:

def update_list
#gather needed info
@items = Items.find(:conditions…

#update using rjs
render :update do |page|
   page['my-items'].replace_html :partial => 'your_partial'
end

end

You should read up a little about rjs, but the basic gist of it is that
you can get to any element on your page by using element proxies
(page[‘my-items’] in the above example). One benefit of using rjs is
that you can update and change as many items on the page you want, with
:update => ‘my-items’, you are limited to updating one thing on the page
per call.

Let me know if you need more help.

-Bill

5

Awesome ! Got it to work

Thanks a lot for your help! I pretty much did it the exact way you
suggested (changed it so it fits my model etc…) but it works :slight_smile:

Now I only have to find a way to paginate that item list haha :wink: