<script type='text/javascript'>
var xmlHttp = getXmlHttpObject();
// come parametri richiede l'identificativo del tag dove mostrare l'esito dell'elaborazione
// e la pagina che si occuperà di elaborare i dati e fornire la risposta
function richiesta_ajax_post(identificativo,percorso_pagina_di_elaborazione){
stringaPost();
xmlHttp.open('POST', percorso_pagina_di_elaborazione, true);
xmlHttp.onreadystatechange = function() {
// nell attesa della risposta possiamo modificare il contenitore inserendo anche un immagine loading
document.getElementById(identificativo).innerHTML="Attendere prego";
if(xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
// mostriamo il risultato dell'elaborazione
document.getElementById(identificativo).innerHTML=xmlHttp.responseText;
}
}
};
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.send(stringa);
}
// funzione che preleva i valori dai campi e crea la stringa da passare alla chiamata ajax
function stringaPost(){
stringa = "";
var form = document.forms[0];
var elementi = form.elements.length;
for(var i = 0; i < elementi; i++){
if(i < elementi-1){
stringa += form.elements[i].name+"="+form.elements[i].value+"&";
}else{
stringa += form.elements[i].name+"="+form.elements[i].value;
}
}
}
function getXmlHttpObject() {
var xmlHttp=null;
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlHttp;
}
</script>
<div id="messaggio">
<form action="form.php" method="post" onsubmit="richiesta_ajax_post('messaggio','elabora_form.php');return false;">
Inserisci il tuo nome :
<input type="text" name="nome"/>
<input type="submit" value="Invia"/>
</form>
</div>