Different Versions of Ajax cannot help but remain unchanged. Each version provides the original XMLHttpRequest to send HTTP requests. There are two types of requests: Get and post. The two methods are used as follows:Code:
I. Ajax request page
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> Ajax principles </title>
<SCRIPT type = "text/JavaScript">
/// Obtain the XMLHTTPRequest object
Function getxmlhttprequest (){
VaR XMLHTTP;
/// Under IE
If (window. activexobject ){
XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
}
/// Firefox
Else if (window. XMLHttpRequest ){
XMLHTTP = new XMLHttpRequest ();
}
Return XMLHTTP;
}
/// Start asynchronous call (get method)
Function startrequestget (){
VaR XMLHTTP = getxmlhttprequest ();
XMLHTTP. Open ("get", "Ajax. aspx? Name = nameget & Birthday = 1900-1-1 ", true); // asynchronous must be used in Firefox, that is, the last parameter must be true.
XMLHTTP. onreadystatechange = function (){
If (XMLHTTP. readystate = 4 & XMLHTTP. Status = 200) {// XMLHTTP. status! = 200 indicates asynchronous failure
// Alert (XMLHTTP. responsetext );
Document. getelementbyid ("target"). innerhtml = XMLHTTP. responsetext;
}
}
// Send the request
XMLHTTP. Send (null );
}
/// Start asynchronous call (the POST method uses the send method to send values such as (XMLHTTP. Send ('name = Jack & Birthday = ')))
Function startrequestpost (){
VaR XMLHTTP = getxmlhttprequest ();
VaR DATA = "name = namepost & Birthday = 2008-12-22 ";
VaR url = "Ajax. aspx? "+ Data; // if you do not need to add data to IE, you must add data to Firefox to send data.
XMLHTTP. Open ("get", URL + '(Firefox)', true );
XMLHTTP. setRequestHeader ('content-type', 'application/X-WWW-form-urlencoded'); // This statement is required when the POST method is used to send data.
XMLHTTP. onreadystatechange = function (){
If (XMLHTTP. readystate = 4 & XMLHTTP. Status = 200 ){
// Alert (XMLHTTP. responsetext );
Document. getelementbyid ("target"). innerhtml = XMLHTTP. responsetext;
}
}
// Send the request
XMLHTTP. Send (Data + "(IE)"); // If Firefox only needs to send null messages, data must be sent in IE.
/* Note:
* The Post Data in IE is sent in XMLHTTP. Send (data). Data is the data to be sent, and the data in Firefox is sent through the URL.
*/
}
</SCRIPT>
</Head>
<Body>
<Input type = "button" onclick = "startrequestget ()" value = "Start asynchronous communication test (get mode)"/> <br/>
<Input type = "button" onclick = "startrequestpost ()" value = "Start asynchronous communication test (post mode)"/>
<Br/>
<Div id = "target" style = "width: 100px; Height: 100px; Border: solid 1px # ff0000;"> </div>
</Body>
</Html>
Ii. Main Code for processing the "Ajax. aspx" request page
Protected void page_load (Object sender, eventargs E)
{
String type = request. httpmethod;
If (type = "get") // use get to send a request and query the string to obtain
{< br> response. write (string. format ("Get: Name: {0}, birthday: {1 }. ", request. querystring ["name"], request. querystring ["Birthday"]);
}< br> else if (type = "Post") // send a request using post, form Method
{< br> response. write (string. format ("post: Name: {0}, birthday: {1 }. ", request. form ["name"], request. form ["Birthday"]);
}< BR >}