Ruby on Rails has excellent support for Ajax baked right into the framework. Remote JavaScript (RJS) templates build upon the Ajax support offered by Rails, allow to easily update multiple page elements.
This is a quick start to work with RJS.
Create your controller:
Let's modify the default controllers now:
Now, we should go to create our views.
Create in the $RJS_Example/app/views/examples create your index.rhtml
In the header include this tag
The :defaults helps to add all the Scriptaculous visual effects and controls.
In the body, add this code.
We use the form_remote_tag() helper instead of the form_tag().
:html option helps to reset the form after completion.
:url option specifies the controller action that receives the form data.
Finally the empty "div id=statement",The id provides a way to reference the element from the RJS template.
Create partial template app/views/examples/_example.rhtml
Create the RJS template: app/views/examples/display.rjs
The page object is an instance of the Rails JavaScriptGenerator.
the partial template app/views/examples/_example.rhtml is rendered, and the resulting content is inserted into the bottom of the statements div.
This is a quick start to work with RJS.
$ rails RJS_Example
Create your controller:
RJS_Example> ruby script/generate controller Examples
exists app/controllers/
exists app/helpers/
create app/views/examples
create test/functional/
create app/controllers/examples_controller.rb
create test/functional/examples_controller_test.rb
create app/helpers/examples_helper.rb
Let's modify the default controllers now:
class ExamplesController < ApplicationController
def index
end
def display
@statement = params[:statement]
end
end
Now, we should go to create our views.
Create in the $RJS_Example/app/views/examples create your index.rhtml
In the header include this tag
<%= javascript_include_tag :defaults %>
The :defaults helps to add all the Scriptaculous visual effects and controls.
In the body, add this code.
<%= form_remote_tag :url => { :action => 'display' },
:html => { :id => 'display-form' } %>
<%= text_field_tag 'statement', nil, :size => 40 %>
<%= submit_tag 'submit statement' %>
<%= end_form_tag %>
We use the form_remote_tag() helper instead of the form_tag().
:html option helps to reset the form after completion.
:url option specifies the controller action that receives the form data.
Finally the empty "div id=statement",The id provides a way to reference the element from the RJS template.
Create partial template app/views/examples/_example.rhtml
[<%= Time.now.to_s(:db) %>]<%=h example %>
Create the RJS template: app/views/examples/display.rjs
page.insert_html :bottom, 'statements', :partial => 'example'
page.visual_effect :highlight, 'statements'
page.form.reset 'display-form'
The page object is an instance of the Rails JavaScriptGenerator.
the partial template app/views/examples/_example.rhtml is rendered, and the resulting content is inserted into the bottom of the statements div.
No comments:
Post a Comment