Ajax POST request help.

f1r3fl3x · November 4, 2007

Can someone help me. I started learning ajax a week ago and i don't know much. I tryed to create a submit form with POST but it didn't work. Please someone help me. Here's the code.

form.html

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="style.css">



<script type="text/javascript" language="javascript">
var http_request = false;

function show_hint ( p_hint_text, p_span ) {
document.getElementById(p_span).innerHTML = p_hint_text ;
}

function makePOSTRequest(url, parameters, SpanName) {
http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) {
alert('Cannot create XMLHTTP instance');
return false;
}

http_request.onreadystatechange = function() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
//alert(http_request.responseText);
result = http_request.responseText;
document.getElementById(SpanName).innerHTML = result;
document.getElementById('status').innerHTML = 'Ready';
} else {
alert('There was a problem with the request.');
}
}
};
http_request.open('POST', url, true);
http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http_request.setRequestHeader("Content-length", parameters.length);
http_request.setRequestHeader("Connection", "close");
http_request.send(parameters);
}


function Contact(obj,SpanName) {
var curDateTime = new Date(); //For IE
var poststr = "name=" + encodeURI( document.getElementById("name").value ) +
"&email=" + encodeURI( document.getElementById("email").value ) +
"&uniqueID=" + curDateTime +
"&msg=" + encodeURI( document.getElementById("msg").value ) ;
var SpanName = SpanName;
//alert (SpanName);
makePOSTRequest('Process.php', poststr, SpanName);
}


</script>


</head>

<body>
<span id="myspan">
<table width="316" border="0" cellpadding="4" cellspacing="0">
<form name="ContactForm" id="ContactForm" action="javascript:Contact(document.getElementById('ContactForm'),'myspan');show_hint('Sending Data... Please wait!', 'status');" method="post">

<tr>
<td width="141" align="right" >Name:</td>
<td width="157"><input name="name2" type="text" id="name" size="20" maxlength="50" /></td>
</tr>
<tr>
<td align="right" >Email:</td>
<td><input name="email2" type="text" id="email" size="20" maxlength="50" /></td>
</tr>
<tr>
<td align="right">Message:</td>
<td><input name="msg2" type="text" id="msg" size="20" maxlength="50" /></td>
</tr>
<tr>
<td align="right"> </td>
<td><input name="Submit2" type="submit" value="Submit" /></td>
</tr>

</form>
</table>
</span>
</body>
</html>

Process.php

<?php

$name = stripslashes($_POST['name']);
$email = stripslashes($_POST['email']);
$msg = stripslashes($_POST['msg']);

echo "
<table width=\"316\" border=\"0\" cellpadding=\"4\" cellspacing=\"0\">
<tr>
<td align=\"left\">Your Information has been processed</td>
</tr>
<tr>
<td align=\"left\">Name: $name <br> Email: $email <br> Message: $msg</td>
</tr>
</table>";

?>

:'(

Sign In

Ajax POST request help.

Recommended Posts

f1r3fl3x

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information