An Brief Introduction to AJAX
AJAX Wikipedia: http://en.wikipedia.org/wiki/Ajax_(programming)
AJAX Description from Captain's Universe, i.e., http://www.captain.at/howto-ajax-form-post-request.php visited on December 1, 2012
Creating XMLHttpRequest Object
XMLHttpRequest object, you need to create an instance of the object in an appropriate way. Different browsers use different syntax to create the object, most code will contain these three code segments:
- With Firefox, Opera 8.0+, and Safari
var xmlHttp=new XMLHttpRequest();
- With Internet Explorer 6.0+
var xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
- With Internet Explorer 5.5+
var xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
// for Firefox, Opera 8.0+, and Safari:
else if (window.ActiveXObject) // for Microsoft IE:
// for IE 6.0+:
// for IE 5.5+:
Create XMLHttpRequest object:
Sending an HTTP Request
You can use the XMLHttpRequest object to send an HTTP request to the server. On the server-side, you need to write and run a PHP program to deal with the AJAX request. As you have learned in an ealier lab, there are two methods to send an HTTP request, namely, get and post. The XMLHttpRequest object provides a pair of
.send() functions. The former configures the type of the HTTP request to be send to the server, while the latter actually makes the request. The following link provides a link on detials of sending an HTTP request using an XMLHttpRequest object.
Send a request to a server:
Working with response
onreadystatechange event provided by the XMLHttpRequest object to deal with the response whenever the state of response changes. The results from the server are stored in the
.responseText attribute as a string or in the
.responseXML as XML data. The following link provides the detail.
Response from the server:
The onreadystatechange event and the callback function:
AJAX PHP Example
The following example will demonstrate how a web page can communicate with a web server while a user type characters in an input field.
AJAX PHP Example
AJAX with MySQL Database
The following link provides an example of using AJAX to retrieve information from a database system.
AJAX with database:
You created a Person table from lab10 where the table has ID, FirstName and LastName information. The task of this lab assignment is to use AJAX to make the request and display the record with the matching requirement. Name your file lab11_ajax.html
For example, if the user input the letter T, the result should display any records
with LastName starts with T.
Hint, SQL LIKE operator is useful for this exercise.
Link your lab11_ajax.html on your index.html.
Zero will be given if the files are not linked on your index.html
Zip the following files and name it Yourusername_lab11.zip. Submit in URcourses by 11:55 PM