AJAX replace items on a page progressively one at a time

rubyonrails-talk
#1

I am working on a problem where I have a large task that is broken
down into a lot of subtasks. The subtasks each take a significant
amount of time to do. My data model looks something like this:

class LargeTask < ActiveRecord::Base
  has_many :sub_tasks
end

class SubTask < ActiveRecord::Base
  belongs_to :large_task
end

When I create the large task, it creates all of the subtasks on its
own and populates them with the data that they need to run, and saves
them. It doesn't actually perform the subtask until I call a method
on the subtask object.

What I am thinking is that when I create a new LargeTask, it will
redirect to the show action of that LargeTask, and will display all of
the subtasks in a list. I will then use AJAX to one-at-a-time call
the Run action on each of the SubTasks and have it update the section
of the page that it is displaying. When one gets finished running,
then the javascript on the page being displayed would kick off the
next task. Basically I want to give the user visual feedback of where
in the process they are.

Is there a way that I can use the AJAX functionality built into rails
to make this happen without having to do some sort of custom control
mechanism to track all of the SubTasks on the client side? Or is
there a better strategy to go about this?

The SubTasks do not need to be run in any particular order. I will
probably eventually run 2 or 3 at a time.

Any suggestions? Thanks in advance.

Jonathan

#2

if the ajax update just re-rendered the list of subtasks then that would probably be enough.
Or if you want to use something fancier then you might have something like

def progress
   #find the subtask that completed and assign it to @subtask
   render :update do |page|
     page[dom_id(@subtask)].addClassName('complete')
   end
end

which will add the complete class to the div/span/whatever with the appropriate id. You could then style it so that such items had a green background or a check mark or whatever visual cue you want to give.

Fred

#3

Thanks for your thoughts. It got me on the right path. I ended up
with a solution that had a small amount of frontend javascript code to
manage the ajax calls. I used remote_function to create functions out
of the ajax call and put them in an array so I could call them
whenever I wanted. It looked something like this.

on th page:

var calls_to_be_made = [];

in the view:

<% subtasks.each do |subtask| %>
  <div id="<%= dom_id(subtask) %>">
    ... content here
  </div>
  calls_to_be_made[calls_to_be_made.length] = function(){ <%=
remote_function(:update => dom_id(subtask), etc...) };

<% end %>

With this method I was able to start as many subtasks as I wanted like
this:

calls_to_be_made[0]();
calls_to_be_made[1]();

and then when one call returned I could have it kick of the next one
until there are none left.

Thanks!
Jonathan