Ajax

Section led by Ivan Lee

Reachable at ivan period lee at cs period stanford period edu

1

- User types a character- Javascript invoked (hint: use a JS class)

- Create and set a function that will be called when an HTTP status 200 is returned

- Construct a POST url to a specific method of a Rails controller, incorporating any necessary parameters

- Send the xmlhttp request

2

- Rails method invoked- Perform any database queries that need

to be done server-side- Render a partial – this creates full HTML,

which is treated as the xmlhttp response!

- What happens if you return a JSON object instead?

- Set the innerhtml of the appropriate object

3

if (window.XMLHttpRequest) { this.xmlhttp = new XMLHttpRequest(); }

this.xmlhttp.onreadystatechange = function()…

this.xmlhttp.open(sMethod, sUrl) this.xmlhttp.setRequestHeader(sName,

sValue) this.xmlhttp.send(varBody) this.xmlhttp.responseText4

Make sure you think about how to make your classes and AJAX code reusable

Make sure you pass along an authenticity token! (see assignment hints section)

Encode your parameters (see assignment hints section)

Make sure thumbnails redirect to the appropriate link. If the user has a large photo collection, make sure that the selected photo is visible.

No using any other JS frameworks, or built-in Rails Ajax Helpers

Test in Firefox Validate your HTML

5

This is the last project!If you want to strut your stuff, this is the time to do it. You have all these tools at your disposal.

6

7