BàI 1: TỔng quan về asp

2.XMLHttp POST Requests

$sAddress = $_POST["txtAddress"];

$sCity = $_POST["txtCity"];

$sState = $_POST["txtState"];

$sZipCode = $_POST["txtZipCode"];

$sPhone = $_POST["txtPhone"];

$sEmail = $_POST["txtEmail"];

$sStatus = "";

$sDBServer = "your.database.server";

$sDBName = "your_db_name";

$sDBUsername = "your_db_username";

$sDBPassword = "your_db_password";

(Name,Address,City,State,Zip,Phone,`E-mail`) ".

" values ('$sName','$sAddress','$sCity','$sState', '$sZipCode'".

", '$sPhone', '$sEmail')";

$oLink = mysql_connect($sDBServer,$sDBUsername,$sDBPassword);

@mysql_select_db($sDBName) or $sStatus = "Unable to open database";

if($oResult = mysql_query($sSQL)) {

$sStatus = "Added customer; customer ID is ".mysql_insert_id();

} else {

$sStatus = "An error occurred

while inserting; customer not saved.";

}

?>

This now represents the entirety of SaveCustomer.php. Note that the header() function is called to set the content type, and echo is used to output $sStatus.

You'll note that the onsubmit event handler has now changed to call the function sendRequest() (although the event handler still returns false to prevent actual form submission). This method first assembles the data for the POST request and then creates the XMLHttp object to send it. The data must be sent in the format as a query string:

name1=value1&name2=value2&name3=value3

Both the name and value of each parameter must be URL-encoded in order to avoid data loss during transmission. JavaScript provides a built-in function called encodeURIComponent() that can be used to perform this encoding. To create this string, you'll need to iterate over the form fields, extracting and encoding the name and value. The getRequestBody() function handles this:

function getRequestBody(oForm) {

var aParams = new Array();

for (var i=0 ; i < oForm.elements.length; i++) {

var sParam = encodeURIComponent(oForm.elements[i].name);

sParam += "=";

sParam += encodeURIComponent(oForm.elements[i].value);

aParams.push(sParam);

}

return aParams.join("&");

This function assumes that you will supply a reference to the form as an argument. An array (aParams) is created to store each individual name-value pair. Then, the elements of the form are iterated over, building up a string and storing it in sParam, which is then added to the array. Doing this prevents multiple string concatenation, which can lead to slower code execution in some browsers. The last step is to call join() on the array, passing in the ampersand character. This effectively combines all the name-value pairs with ampersands, creating a single string in the correct format.

String concatenation in most browsers is an expensive process because strings are immutable, meaning that once created, they cannot have their values changed. Thus, concatenating two strings involves first allocating a new string and then copying the contents of the two other strings into it. Repeating this process over and over causes a severe slowdown. For this reason, it's always best to keep string concatenations at a minimum and use the array's join() method to handle longer string concatenation.

The sendRequest() function calls getRequestBody() and sets up the request:

function sendRequest() {

var oForm = document.forms[0];

var sBody = getRequestBody(oForm);
var oXmlHttp = zXmlHttp.createRequest();

oXmlHttp.open("post", oForm.action, true);

oXmlHttp.setRequestHeader("Content-Type",

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

oXmlHttp.onreadystatechange = function () {

if (oXmlHttp.readyState == 4) {

if (oXmlHttp.status == 200) {

saveResult(oXmlHttp.responseText);

} else {

saveResult("An error occurred: " + oXmlHttp.statusText);

}

}

};

}

As with previous examples, the first step in this function is to get a reference to the form and store it in a variable (oForm). Then, the request body is generated and stored in sBody. Next comes the creation and setup of the XMLHttp object. Note that the first argument of open() is now post instead of get, and the second is set to oForm.action (once again, so this script can be used on multiple pages). You'll also notice that a request header is being set. When a form is posted from the browser to a server, it sets the content type of the request as application/x-www-form-urlencoded. Most server-side languages look for this encoding in order to parse the incoming POST data properly, so it is very important for it to be set.