|
Thursday Nov 16, 2006
This is a basic ajax script and you can just fetch the code and use it for free,
I am not giving much description line by line, but to start ajax you can use,
If you have any comments, please click on live help button and leave a message, I will be not online to chat with you,
But I will reply to your question if I am free.
Thank You.
<script Language="JavaScript">
var http_request = false;
function ShowExistingRecords() {
var email_address= document.getElementById('email_address').value; //(1)
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
} else if (window.ActiveXObject) { // IE
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
http_request.onreadystatechange = ShowExistingRecordsSub;
http_request.open('POST', 'filename.ajax.php?email_address='+email_address, true); //(2)
http_request.send(null);
}
function ShowExistingRecordsSub() {
document.getElementById('showexistingrecordtext').innerHTML = '<small><i>Loading...</i></small>'; //(3)
if (http_request.readyState == 4) {
var response = http_request.responseText;
document.getElementById('showexistingrecordtext').innerHTML = response; //(4)
}
}
</script>
(1) getting the email address from the element id "email_address"
(2) passing parameters to php file
(3) displaying loading on element id "showexistingrecordtext"
(4) displaying the out put from the filename.ajax.php after passing the variable email_address on element id "showexistingrecordtext"
filename.ajax.php can be a normal database program where if your give a slq to the database it will display the result,
What ever the out-put comming from the filename.ajax.php it will display in element id "showexistingrecordtext"
Full Page will be as follows:
<html>
<head>
<script Language="JavaScript">
var http_request = false;
function ShowExistingRecords() {
var email_address= document.getElementById('email_address').value; //(1)
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
} else if (window.ActiveXObject) { // IE
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
http_request.onreadystatechange = ShowExistingRecordsSub;
http_request.open('POST', 'filename.ajax.php?email_address='+email_address, true); //(2)
http_request.send(null);
}
function ShowExistingRecordsSub() {
document.getElementById('showexistingrecordtext').innerHTML = '<small><i>Loading...</i></small>'; //(3)
if (http_request.readyState == 4) {
var response = http_request.responseText;
document.getElementById('showexistingrecordtext').innerHTML = response; //(4)
}
}
</script>
<title>My Profile</title>
</head>
<body>
<p>
<input type="text" name="email_address" size="20" id="email_address">
<input type="submit" value="Get Profile" name="GetProfile">
</p>
<table border="0" width="100%" id="table1" cellpadding="4" style="border-collapse: collapse">
<tr>
<td id="showexistingrecordtext"> </td>
</tr>
</table>
</body>
</html>
Source: eInterNext.Com
|
