AJAX Todo

  1. Learning Objectives
  2. Summary
  3. Releases
  4. Helpful Resources

** DO NOT MERGE SOLUTION PULL REQUESTS INTO THIS REPOSITORY **

Learning Objectives

    1. Making an AJAX request from form input
  1. Rendering HTML partials in response to an AJAX request
  2. Altering the DOM with the response from an AJAX request
  3. Rendering JSON in response to an AJAX request
  4. Altering the DOM based upon JSON data.
  5. Using client side templates to alter the DOM

Summary

In this challenge you will take a working todo app and add modify the requests to work with AJAX

Releases

Release 1

  • Modify the existing requests to submit a new todo so it uses AJAX to submit the request and jQuery to render the response on the page if the request is successful. Use a string for the response.

Release 2

  • Implement complete with AJAX.
  • Change the DOM complete form to a simple link or button.

Release 3

  • Add delete functionality so a user can delete any completed or non completed todo.

Release 4

  • Redo Release 1 with a partial in the response.
  • Redo Release 1 with JSON in the response.

Release 5

  • Wow there cowboys... have you REALLY been doing this all without tests? This would be a great time to add some it. Cabybara and rspec first, then try some Jasmine.

Submit a Pull Request after each Release.

DO NOT MERGE SOLUTION PULL REQUESTS INTO THIS REPOSITORY

Helpful Resources

  1. jQuery.post
  2. jQuery.ajax
  3. jqXHR
  4. jqXHR.done
  5. jqXHR.fail
  6. $('form').serialize
  7. xhr?
  8. How not to include layout in sinatra app
  9. Sinatra Local vs Instance variables
  10. Rendering json in Sinatra
  11. UnderscoreJS Template
  12. MustacheJS
  13. Testing Javascript Apps with Capybara
  14. Capybara and Selenium