Ajax on Rails

Home » Ajax on Rails

The hardest way to use Ajax in any web application is to write own custom JavaScript that directly uses the XMLHttpRequest object's API. By doing this, you have to deal with the intricacies of each browser.
An easier way is to use one of several JavaScript libraries that provide higher-level Ajax services and hide the differences between browsers. Libraries such as DWR, Prototype, Sajax, and Ajax.NET are all good choices.
The easiest way of all is to use the built-in Ajax facilities of Ruby on Rails. In fact, Rails makes Ajax so easy that for typical cases it's no harder to use Ajax than it is not to!

How Rails Implements Ajax

Rails has a simple, consistent model to implement Ajax operations.
Different user actions can cause it to display a new web page or can actually trigger an Ajax operation:

  1. A trigger action might be a user clicking on a button or link, the user making changes to the data on a form or in a field.
  2. Data associated with the trigger (a field or an entire form) is sent asynchronously to an action handler on the server via XMLHttpRequest.
  3. The server-side action handler takes some action based on the data, and returns HTML data as its response.
  4. The client-side JavaScript receives the HTML fragment and uses it to update a specified part of the current page's HTML, often the content of a <div> tag.

One of the simplest helper methods for implementing Ajax through Rails is “link_to_remote()”, that calls the controller action on just the click of a link. The exact method to define such a link in any view can be:

1st Method

<%= link_to_remote( “click here”, :update =>”time_now”, :url => {:action => :check_time}, :position => ‘after’) %>


The parameters in the above helper method can be defined as follows:-

  1. The text to display for the link--in this case, "click here".
  2. The id of the DOM element (i.e. the “div” element in your view) containing content to replace with the results of executing the action--in this case, time_now.
  3. The URL of the server-side action to call--in this case, an action called “check_time” that will be defined in the controller.
  4. The last parameter here is the position where the HTML generated through AJAX will be displayed. In this case the result set would be displayed after the target element named “time_now” i.e. the div on your view.

2nd method

One more method that I have come across and used in my applications is a “form_remote_tag”. It is quite similar in execution to the link_to_remote except for the fact that it also sends the contents of an HTML form.

A typical example of such a form tag for any view can be :

<%= form_remote_tag( :update =>”my_list”, :url => { :action => :new_item }, :position => “top”) %>


Form Elements

<%= end_form_tag %>


You can go in for time bound AJAX functionality in which the text field can be observed at a particular time interval to update the results. One example for this can be a search condition where the text field is constantly checked/observed for the changes in its value and the results can be shown in the DOM element i.e.<div> tag.

Search : <%= text_field_tag :search %>
<%= observe_field(:search, :frequency => 0.25, :update => :search_hits, :url => {:action => :search}) %>

Also a <div> element named “search_hits” can be placed within your view.

Services



   
Testimonials


Oracle