The following Javascript functions can be used to manually POST (or get) data using a form without worrying about what (or how many) elements are in your <form>.

It (ab-)uses “XMLHttpRequest” for the POST part.
Code:

function getHTML(serverPage, objID) {
var ajax=false;
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
@end @*/
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
var obj = document.getElementById(objID);
ajax.open("GET", serverPage);
ajax.onreadystatechange = function() {
if (ajax.readyState == 4 && ajax.status == 200) {
obj.innerHTML = (ajax.responseText);
setrelextbh();
}
}
ajax.send('');
return false;
}

function getFormResults(formID, objID) {
var ajax=false;
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
@end @*/
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
var obj = document.getElementById(objID);
var DataForm = document.getElementById(formID);
ajax.open(DataForm.method, DataForm.action);
ajax.onreadystatechange = function() {
if (ajax.readyState == 4 && ajax.status == 200) {
obj.innerHTML = ajax.responseText;
var obj2 = document.getElementById('popupmessagetext');
if (obj2) {
alert(obj2.innerHTML);
obj2.innerHTML = '';
}
setrelextbh();
}
}
var DataString = "";
for( var i=0; i<DataForm.elements.length; i++ ){
DataForm.elements[i].disabled=true;
eName = DataForm.elements[i].name;
if( eName && eName != '') {
if ((DataForm.elements[i].type.toLowerCase() == 'radio') || (DataForm.elements[i].type.toLowerCase() == 'checkbox')) {
if (DataForm.elements[i].checked==true) {
DataString = DataString + eName + '=' + escape(DataForm.elements[i].value).replace(new RegExp("\\x2B", "g"), "%2b");
} else if (DataForm.elements[i].type.toLowerCase() == 'checkbox') {
DataString = DataString + eName + '=0';
}
} else {
DataString = DataString + eName + '=' + escape(eval("DataForm."+eName+".value")).replace(new RegExp("\\x2B", "g"), "%2b");
}
if( i != DataForm.elements.length - 1 ) DataString = DataString + '&';
}
}
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.setRequestHeader("Content-Length", DataString.length);
ajax.send(DataString);
return false;

}

Usage: Simply put it in the FORM tag.

form method="post" action="?" id="commentform"onsubmit="getFormResults('commentform','content'); return false"

Of course in this case “commentform” is the ID of the form I wish to submit, and “content” is the ID of the DIV on my page that i wish to fill with the result of the POST action.

The getFormResults function assumes that the form tag has a “method” and an “action”. It takes all the values set in the form elements (textarea, input, checkbox, radio buttons,etc….) and creates a name=value& string sequence based on whatever elements if finds. It then sends that data to the form action URI (ajax.send(DataString);) and waits for the objects “onreadystatechange” event.

You can see it in action when commenting here.

PHP powered, of course!

Source can be found here:
/source/quotes/