AJAX: Properties of XMLHttpRequest

Back | Tutorial Home | Next

There are various properties associated with XMLHttpRequest which need to be used to complete AJAX life cycle. Following are the various properties of XMLHttpRequest object

• onreadystatechange
• readyState
• responseText
• responseXML
• status
• statusText

The onreadystatechange Property

onreadystatechange property of XMLHttpRequest needs to be set before the request is sent to the server. The function set to this property acts as the event handler function when the state of the request changes. The various states of the request are

• Request not initialized
• Request set up
• Request sent
• Request in process
• Request completed

When ever there is change in the state the function set for onreadystatechange property is invoked

xmlHttp=CreateXmlHttpObject();
xmlHttp.onreadystatechange=stateChanged();
stateChanged() {
// Code for handling the various state changes.
}

readyState Property

readyState property of XMLHttpRequest stores various states of the request mention in the above section. Each time this property changes the function set for onreadystatechange property is invoked. Given below is the various states and their respective values

Here are the possible values for the readyState property:

This property is usually checked in the function set for onreadystatechange property for processing the request

xmlHttp=CreateXmlHttpObject();
xmlHttp.onreadystatechange=stateChanged();
stateChanged() {
if (xmlHttp.readyState==4)
{
// Code for handling request after the request is completed
}
}

responseText Property

responseText Property holds the data sent by server in text format.

xmlHttp=CreateXmlHttpObject();
xmlHttp.onreadystatechange=stateChanged();
stateChanged() {
if (xmlHttp.readyState==4)
{
responseData = xmlHttp.responseText;
}
}

responseXML Property

responseXML Property holds the data sent by server in XML format.

xmlHttp=CreateXmlHttpObject();
xmlHttp.onreadystatechange=stateChanged();
stateChanged() {
if (xmlHttp.readyState==4)
{
xmlResponseData = xmlHttp.responseXML;
}
}

status Property

This property holds the HTTP status codes from the server. The most popularly used status codes are

• 200 - OK
• 302 - Found
• 403 - Forbidden
• 404 - Not Found
• 500 - Internal Server Error
  

Normally we don’t need to handle all these status codes unless your requirements need to handle them. All the status codes other than 200 can assumed to be errors.
xmlHttp=CreateXmlHttpObject();
xmlHttp.onreadystatechange=stateChanged();
stateChanged() {
if (xmlHttp.readyState==4)
{
if (xmlHttp.status == 200) {

// request successfull
}
else {
// show error message.
}
}
}
statusText Property

This property holds the HTTP status message from the server. statusText property is related to status property.

• OK for 200
• Found for 302
• Forbidden for 403
• Not Found for 404
• Internal Server Error for 500

xmlHttp=CreateXmlHttpObject();
xmlHttp.onreadystatechange=stateChanged();
stateChanged() {
if (xmlHttp.readyState==4)
{
if (xmlHttp.status == 200) {

// request successfull
}
else {
errorMessage = xmlHttp.statusText
}
}
}

Back | Tutorial Home | Next