:::::::::::::::::::::::::: :::::::::::::::::::::::::

Departure XMLHttpRequest

I shall start from the very beginning: creation XMLHttpRequest and his{its} sending from a browser. Unfortunately, the method of creation XMLHttpRequest differs from a browser to a browser. Function in JavaScript in listing 2 smooths these difficulties of different browsers, defining{determining} the correct approach for the given browser and returning XMLHttpRequest ready to use. It is the best way to think of it as about a code - pattern: simple his{its} copying in your library JavaScript and his{its} use when it is required to you XMLHttpRequest.

Listing 2. Creation XMLHttpRequest for different browsers

/*

* Returns new XMLHttpRequest object or false if the browser of it{him} does not support

*/

function newXMLHttpRequest () {

var xmlreq = false;

if (window. XMLHttpRequest) {

// We shall create XMLHttpRequest object for not - Microsoft browsers

xmlreq = new XMLHttpRequest ();

} else if (window. ActiveXObject) {

// We shall create XMLHttpRequest with help MS ActiveX

try {

// We shall try to create XMLHttpRequest for late versions

// Internet Explorer

xmlreq = new ActiveXObject (" Msxml2. XMLHTTP ");

} catch (e1) {

// It was not possible to create required ActiveXObject

try {

// We taste a variant which will be supported with older versions

// Internet Explorer

xmlreq = new ActiveXObject (" Microsoft. XMLHTTP ");

} catch (e2) {

// Be not capable to create XMLHttpRequest with help ActiveX

}

}

}

return xmlreq;

}

Later we shall discuss techniques for browsers which do not support XMLHttpRequest. And now examples assume, that function newXMLHttpRequest from listing 2 always returns value XMLHttpRequest.

Coming back back to the script of an example of a basket of the buyer, I would like to use Ajax for cases when the user presses Add to Cart the button for the catalogue of products. The operator onclick, called addToCart (), is responsible{crucial} for updating of a status of a basket in a Ajax-call (see listing 1). As shown in the listing 3, the first, that it is necessary to make addToCart (), - to obtain data XMLHttpRequest with the help of a call of function newXMLHttpRequest () from listing 2. The following step he registers function of callback for reception of the answer of the server, (I shall explain it in detail later, look listing 6).

As the search will change a status on the server, I shall use method HTTP POST that it to execute. Sending given is carried out by method POST in three steps. First, it is necessary for me to open connection with a source of the server with which I am connected, that in this case is servletom, brought in cart.do pages. Further I fix{establish} heading in XMLHttpRequest, speaking that contents of search - the coded data. And, at last, I send search with the coded data in a body of contents.

Listing 3 shows all these steps together.

Listing 3. We send XMLHttpRequest for button Add to Cart

/*

* Adds a product determined by his{its} code,

* In a basket of the buyer

* itemCode - a code of a product for addition.

*/

function addToCart (itemCode) {

// Returns contents XMLHttpRequest

var req = newXMLHttpRequest ();

// The operator for reception of the message of callback

// From object of search

var handlerFunction = getReadyStateHandler (req, updateCart);

req.onreadystatechange = handlerFunction;

// We open HTTP-connection with the help of a POST-method to servletu baskets of the buyer.

// The third parameter defines{determines}, that search asynchronous.

req.open ("POST", "cart.do", true);

// Defines{Determines}, that in contents of search there are data

req.setRequestHeader ("Content-Type",

"application/x-www-form-urlencoded");

// We send the coded data, speaking that I want to add

// The certain product in a basket.

req.send (" action=add*item = " + itemCode);

}

After all it you have understood the first part in mechanism Ajax - actually creation and transfer of HTTP-search from the client. The following step will be a code servleta in language Java for processing search.