Submit Form Using Ajax (Post)

Post.html

<script type="text/javascript" language="javascript">// <![CDATA[
var h_request = false;
function makePOSTRequest(url, parameters) {
h_request = false;

<!--more-->

if (window.XMLHttpRequest) //MOZILLA
{
h_request = new XMLHttpRequest();
if (h_request.overrideMimeType)
{
h_request.overrideMimeType('text/html');
}
}
else if (window.ActiveXObject) { // IE
try {
h_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
h_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!h_request) {
alert('Cannot create XMLHTTP instance');
return false;
}

h_request.onreadystatechange = alertContents;
h_request.open('POST', url, true);
h_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
h_request.setRequestHeader("Content-length", parameters.length);
h_request.setRequestHeader("Connection", "close");
h_request.send(parameters);
}

function alertContents() {
if (h_request.readyState == 4) {
if (h_request.status == 200) {
result = h_request.responseText;
document.getElementById('myspan').innerHTML = result;
} else {
alert('There was a problem with the request.');
}
}
}

function get(obj) {
var poststr = "mytextarea1=" + encodeURI( document.getElementById("mytextarea1").value ) +
"&mytextarea2=" + encodeURI( document.getElementById("mytextarea2").value );
makePOSTRequest('post.php', poststr);
}

// ]]></script>

<form action="javascript:get(document.getElementById('form1'));" name="form1" id="form1">
<textarea id="mytextarea1">testing data
1
2
3
</textarea>
<textarea id="mytextarea2">testing data 2
4
5
6</textarea>
<br>
<input type="button" name="button" value="Submit"
onclick="javascript:get(this.parentNode);">

</form>

<br><br>
Server-Response:<br>
<hr>
<span name="myspan" id="myspan"></span>
<hr>

Post.php

<?
print_r($_POST);
?>

Advertisements