Question

I am using jquery to fire an ajax request when check box is changed to alter the boolean attribute ‘completed’ on resource ‘Task’. I have the following code regarding AJAX part, but I get this error > bad URI `/projects/1/tasks/[object%20Object]’

tasks.js.coffee

    $('#task_completed').bind 'change', (event) =>
      url = $('#task_completed').closest('form').attr('action')
      data = {}
      data.task = {}
      $.post({
        url: url
        data: data
        success: ->
          $('.task_headline').toggleClass('completed_task')
      })

task/show.html.erb

       <%= form_for [@project, @task], :remote => true do |f| %>
         <%= f.label :completed %>       
         <%= f.check_box :completed %> <!-- this automatically has the id="task_completed" -->
       <% end %> 

Answer 1

If you don’t want to specify data, don’t specify data.

    $('#task_completed').bind 'change', (event) =>
      url = $('#task_completed').closest('form').attr('action')

      $.post({
        url: url
        success: ->
          $('.task_headline').toggleClass('completed_task')
      })

Also, you are forgetting a comma behind url:url, which might be necessary.

    $('#task_completed').bind 'change', (event) =>
      url = $('#task_completed').closest('form').attr('action')

      $.post({
        url: url,
        success: ->
          $('.task_headline').toggleClass('completed_task')
      })

If it still happens then, you’ll want to replace the function temporarily by:

window.alert($('#task_completed').closest('form').attr('action'))

If this shows [object%20Object] in the alert then there’s something wrong where you are saving the form. Please note that [object%20Object] means that you are trying to print out an object which has no explicit toString() defined. This is exactly what happens when you try to convert {} to a string.

Don’t believe me? Copy the following to your address bar and hit enter:

javascript:var test = {};window.alert(test.toString());