Hi all,
I’ve successfully got the Ajax working with the POST method with the codes bellow. But in stead of taking a logged in user to the user area, it pulled the home.php to the <div id=“message”></div> block. So how do I take a logged in user to the user area directly.
Forgive me if the question stupid, I’ve just learned ajax and javascript seriously two days ago. But I have used javascript for years knowing only how to use something like <script src=“js/jquery.ajax.googleapi.1.4.2.js”></script> in the header section.
<html>
<head>
<title>PHP using AJAX</title>
<script type="text/javascript">
var time_variable;
function getXMLObject() { //XML OBJECT
var xmlHttp = false;
try {
xmlHttp = new XMLHttpRequest(); //For Mozilla, Opera Browsers
} catch (e) {
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP") // For Old Microsoft Browsers
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") // For Microsoft IE 6.0+
} catch (e) {
xmlHttp = false // No Browser accepts the XMLHTTP Object then false
}
}
}
return xmlHttp; // Mandatory Statement returning the ajax object created
}
var xmlhttp = new getXMLObject(); //xmlhttp holds the ajax object
function ajaxFunction() {
var getdate = new Date(); //Used to prevent caching during ajax call
if(xmlhttp) {
var email = document.getElementById("email");
var password = document.getElementById("password");
xmlhttp.open("POST","check.php",true); //calling testing.php using POST method
xmlhttp.onreadystatechange = handleServerResponse;
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send("email=" + email.value + "&password=" + password.value); //Posting email, password to PHP File
}
}
function handleServerResponse() {
if (xmlhttp.readyState == 4) {
if(xmlhttp.status == 200) {
document.getElementById("message").innerHTML = xmlhttp.responseText; //Update the HTML Form element
}
else {
alert("Error during AJAX call. Please try again");
}
}
}
</script>
<body>
<form method="post" name="myForm">
<table>
<tr>
<td>Enter Email</td>
<td><input type="text" name="email" id="email" /></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="password" id="password" /></td>
</tr>
<tr>
<td colspan="2"><input type="button" value="Submit" onclick="ajaxFunction();" /></td>
</tr>
</table>
</form>
<div id="message" name="message"></div>
</body>
</head>
</html>