I needed a refresher with RJS so I watched Peepcode’s screencast on RJS. I know it was not rails 2 so I decided to share what I changed to make it work with rails 2.
I used the SQL lite db for the demo. To set it up I created the rails project
rails rjs_demo
I used the scaffold to get it off the ground
script/generate scaffold Task name:string value:integer
And that will take care of the CRUD, routes and all that fun stuff.
You don’t need the dom_id plugin we can use the div_for
I’m just used the index.html.erb file instead of making a list file.
I added to the routes file
:collection => { :hello => :any }
To the map.resources :tasks line and the link now says
map.resources :tasks, :collection => { :hello => :any }
The link for the say hello
<%= link_to_remote "Say Hello", :url => hello_tasks_path %>
Instead of
<%= link_to_remote "Say Hello", :url => tasks_url(:action => 'hello') %>
In the tasks_controller.rb add a hello method.
def hello respond_to do |format| format.js end end
add into the views/tasks folder the file hello.js.rjs
page.alert "hello world!"
Partials.
For the tasks partial create the _task.html.erb file.
With rails 2 you can call a partial but using <%= render :partial => @tasks %>
and then in the task instead of using the dom_id you can use the div_for
Highlight me.
In routes file I added
:member => { :highlight => :post }
to the map.resources :tasks line. It should read
map.resources :tasks, :collection => { :hello => :any }, :member => { :highlight => :post }
that gives us the route
highlight_task POST /tasks/:id/highlight {:action=>"highlight", :controller=>"tasks"}
so the link is <%= link_to_remote "highlight me ", :url => highlight_task_path(task) %>
In the controller
def highlight @task = Task.find(params[:id]) respond_to do |format| format.js end end
And make the highlight.js.rjs file
the form.
you can use the remote_form_for
<%= error_messages_for :task %> <% remote_form_for(:task, :url => tasks_path, :html => {:id => "task_form"}) do |f| %> <p> <b>Name</b><br /> <%= f.text_field :name %> </p> <p> <b>Value</b><br /> <%= f.text_field :value %> </p> <p> <%= f.submit "Create" %> </p> <% end %>
And in the index.html.erb file call the partial
<%= render :partial => 'form' %>
Don't forget the add the format.js in the is @save section
Now make the create.js.rjs file
page.insert_html :bottom, 'tasks', :partial => @task page['task_form'].reset
When adding the super_special class I changed the link to
page.call "set_class_name", "task_#{@task.id}", 'super_special'
and it works
now destroy
In the destroy.js.rjs file
page.remove "task_#{@task.id}"
and add the format.js to the destroy method.
The destroy link will look like.
<%= link_to_remote "destroy", :url => task_path(task), :method => :delete, :confirm => "Do you want to delete '#{task.name}'?" %>
Replace.
_totals.js.rjs file I used this line
page.replace_html 'task_totals', @task_totals
The shared error file
create the shared folder and add an error.js.rjs file to it
the code it the same in the rjs file
in the tasks_controller in the condidtional andd this for an error
format.js { render :template => "shared/error.js.rjs" }
that will make the popup work.
These are my rough notes.
John
No comments:
Post a Comment