Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
update Built-in Rails Helpers section [ci skip]
  • Loading branch information
Francesco Rodriguez committed Jun 20, 2012
1 parent a59b1ee commit 12d5732
Showing 1 changed file with 38 additions and 16 deletions.
54 changes: 38 additions & 16 deletions guides/source/ajax_on_rails.textile
Expand Up @@ -12,16 +12,16 @@ endprologue.

h3. Hello AJAX - a Quick Intro

AJAX is about updating parts of a web page, without reloading the page. An AJAX
AJAX is about updating parts of a web page without reloading the page. An AJAX
call happens as a response to an event, like when the page finished loading or
when a user clicks on an element. For example, let say you click on a link, which
would usually take you to a new page, but instead of doing that, an asynchronous
HTTP request is made and the response is evaluated with javascript. That way the
page is not reloaded, and new information can be dynamically included in the page.
HTTP request is made and the response is evaluated with JavaScript. That way the
page is not reloaded and new information can be dynamically included in the page.
The way that happens is by inserting, removing or changing parts of the DOM. The
DOM, or Document Object Model, is a convention to represent the HTML document as
a set of nodes that contain other nodes. For example a list of names is represented
as a +ul+ element node containing several +li+ element nodess. An AJAX call can
a set of nodes that contain other nodes. For example, a list of names is represented
as a +ul+ element node containing several +li+ element nodes. An AJAX call can
be made to obtain a new list item to include, and append it inside a +li+ node to
the +ul+ node.

Expand All @@ -34,7 +34,7 @@ not required, you respond to the HTTP request with JSON or regular HTML as well.

h4. The DOM

The DOM(Document Object Model) is a convention to represent HTML (or XML)
The DOM (Document Object Model) is a convention to represent HTML (or XML)
documents, as a set of nodes that act as objects and contain other nodes. You can
have a +div+ element that contains other +div+ elements as well as +p+ elements
that contain text.
Expand All @@ -53,13 +53,43 @@ that gets returned, and the page is not reloaded.
h3. Built-in Rails Helpers

Rails 4.0 ships with "jQuery":http://jquery.com as the default JavaScript library.
The Gemfile contains <tt>gem 'jquery-rails'</tt> which makes the jQuery files
available to the application automatically. This can be accessed as:
The Gemfile contains +gem 'jquery-rails'+ which provides the +jquery.js+ and
+jquery_ujs.js+ files via the asset pipeline.

You will have to use the +require+ directive to tell Sprockets to load +jquery.js+
and +jquery.js+. For example, a new Rails application includes a default
+app/assets/javascripts/application.js+ file which contains the following lines:

<plain>
// ...
//= require jquery
//= require jquery_ujs
// ...
</plain>

The +application.js+ file acts like a manifest and is used to tell Sprockets the
files that you wish to require. In this case, you are requiring the files +jquery.js+
and +jquery_ujs.js+ provided by the +jquery-rails+ gem.

If the application is not using the asset pipeline, this can be accessed as:

<ruby>
javascript_include_tag :defaults
</ruby>

By default, +:defaults+ loads jQuery.

You can also choose to use Prototype instead of jQuery and specify the option
using +-j+ switch while generating the application.

<shell>
rails new app_name -j prototype
</shell>

This will add the +prototype-rails+ gem to your Gemfile.

You are ready to add some AJAX love to your Rails app!

h4. Examples

To make them working with AJAX, simply pass the <tt>remote: true</tt> option to
Expand Down Expand Up @@ -121,14 +151,6 @@ will produce
</form>
</html>

You can also choose to use Prototype instead of jQuery and specify the option using +-j+ switch while generating the application.

<shell>
rails new app_name -j prototype
</shell>

You are ready to add some AJAX love to your Rails app!

h4. The Quintessential AJAX Rails Helper: link_to_remote

Let's start with what is probably the most often used helper: +link_to_remote+. It has an interesting feature from the documentation point of view: the options supplied to +link_to_remote+ are shared by all other AJAX helpers, so learning the mechanics and options of +link_to_remote+ is a great help when using other helpers.
Expand Down

0 comments on commit 12d5732

Please sign in to comment.