1. XMLHttpRequest

  2. What is it?

    It's an object.

    Not part of the DOM: it's proprietary!

    Used to be called 'Remote Scripting'.

    Invented by Microsoft (IE5).

    Mozilla followed suit (Netscape 7).

    Safari 1.2+, Opera 8+

  3. Lives in limbo

    Imagine this object sitting between the client and the server.

    diagram
  4. Create an instance

  5. Three cornerstones

    1. The onreadystatechange event handler.
    2. The open method.
    3. The send method.
  6. The onreadystatechange event handler

    xhr.onreadystatechange = function() {
      doSomething(xhr);
    };

    The readystatechange event is triggered every time the readyState property changes.

    This event is triggered from the server.

  7. The open method

    xhr.open(method,file,asynchronous?);

    Accepts three parameters

  8. The send method

    xhr.send(data);

    Accepts one parameter: any data to be sent to the server.

  9. Prepare your transmission

  10. The readyState property

  11. Testing for readyState

  12. The status property

    Returns a standard server response e.g. 404, 303, 500, etc.

    200 is what you want.

  13. Testing for success

  14. What you get back

  15. Example

    Using XMLHttpRequest to display the contents of a text file.

    View HTML

    View JavaScript

  16. Methods and properties

    diagram
  17. Next

    Which data format should you use?