Thursday 19 February 2015

Ajax Beginners Tutorial

What Is Ajax?


Ajax stands for Asynchronous JavaScript and XML, 
it is to update the web page, using data fetched from the Internet, without refreshing the web page in the browser. You saw an example of that with Google Suggest, where a drop-down list appears in the browser without a page refresh.

Example:-



Note: please make data.txt file and put in same folder then you will get same information which is mention in that data.txt file.

You can also give a complete URL for the data you want to fetch, like this:

Example:-




Creating the XMLHttpRequest Object:-

syntax:-

XMLHttpRequestObject = new XMLHttpRequest();

Example:-




Ajax which function you want to call?

You tell the XMLHttpRequest object. That object has a property named onreadystatechange
that you assign the callback function to. As an example of how it might work, suppose you have
a callback function simply named callback. Here’s how you could have the XMLHttpRequest

object call that function, by assigning that function to the onreadystatechange property:

Example:-




The readyState property tells you how the data downloading is going.


  • 0 Uninitialized
  • 1 Loading
  • 2 Loaded
  • 3 Interactive
  • 4 Complete

  • 200 OK
  • 201 Created
  • 204 No Content
  • 205 Reset Content
  • 206 Partial Content
  • 400 Bad Request
  • 401 Unauthorized
  • 403 Forbidden
  • 404 Not Found
  • 405 Method Not Allowed
  • 406 Not Acceptable
  • 407 Proxy Authentication Required
  • 408 Request Timeout
  • 411 Length Required

  • 413 Requested Entity Too Large
  • 414 Requested URL Too Long
  • 415 Unsupported Media Type
  • 500 Internal Server Error
  • 501 Not Implemented
  • 502 Bad Gateway
  • 503 Service Unavailable
  • 504 Gateway Timeout
  • 505 HTTP Version Not Supported

Using the readyState Property:-

Example:-






Using the status Property:-

Example:-





An Ajax example using PHP:-

Example:-




Sending data to server:-

Example:-


No comments:

Post a Comment