Topic: Ajax Checkbox Completed Action Routing Errors

Hi,

We're working on a simple tasks application and are trying to add a checkbox to the index.html.erb view which sets the status of a task to true (completed) via ajax and jquery. We're pretty much there think but are running into some routing errors.

Have also followed this post through: http://railsforum.com/viewtopic.php?id=40753 V. helpful smile

In my tasks index.html.erb view I have this

<%= check_box_tag 'complete_task_1', '', false, { 'data-href' => completed_task_path(:id => task.id) } %>

In my tasks controller

def completed 
    @task = Task.find(params[:id])
    @task.status = true
    @task.save
  end

And in my application.js:

 $('#complete_task_1').click(function() {
  $.ajax({
    url: $(this).data('href'),
    type: 'PUT',
    dataType: 'html',
    success: function(data, textStatus, jqXHR) {
        alert ('carefully enter the mark'); 
    }
  });
});

In my routes.rb I've tried this

resources :tasks do
      collection do
          get :completed
      end
end

Which gives this error on loading the page:

No route matches {:controller=>"tasks", :action=>"completed", :id=>2}

And also this:

get 'task/:id' => 'tasks#completed', :as => :completed_task

Which shows no errors in the browser, but when you check the box, nothing happens and the development log shows:

ActionController::RoutingError (No route matches "/tasks")

I hope someone out there can help, we've been stuck for days!!

Bob

Re: Ajax Checkbox Completed Action Routing Errors

Found some luck changing to a button_to and testing routes without worrying about ajax call. Got some working with this in my routes.rb:

match 'tasks/:id/completed' => 'tasks#completed', :as => :completed_task

And then changing my checkbox to:

<%= check_box_tag 'complete_task_1', '', false, { 'data-href' => completed_task_path(task.id) } %>

Finally, it seems to be my javascript -  I can, for example, change the colour of a div using the check box. I just cannot update the status attribute.

How can I do this?

$('#complete_task_1').click(function() {
  $.ajax({
    url: $(this).data('href'),
    type: 'GET',
    dataType: 'html',
    success: function(data) {
  // What goes in here! //
    }
  });
});