onreadystatechange che non funziona.

[Nunkij]

Salve a tutti vi incollo il codice e poi vi spiego il problema.

Pagina form.php

    <div id='boxForm'>
        <form  method='post' id='fmIndex' onsubmit='return handleServerResponse()' >

            Nome <input type='text' name='txtNome' id='txtNome' /><br />
            Cognome <input type='text' name='txtCognome' id='txtCognome' /><br />
            Email <input type='text' name='txtEmail' id='txtEmail' /><br />
            <input type='submit' value='Invia' />
        </form>
    <div>

Pagina form.js

var xmlhttp = createXmlHttpRequestObject();

var I_UNINITIALIZED = 0;
var I_LOADING = 1;
var I_LOADED = 2;
var I_INTERACTIVE = 3;
var I_COMPLETE = 4;


// ### RESTITUISCE L'OGGETTO XMLHttpRequest
function     createXmlHttpRequestObject(){
    
            var xmlHttp;
            
            // ### SE SI USA INTERNET EXPLORER
            if    (window.ActiveXObject){
                
                try{
                    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                }catch     (e){
                        xmlHttp = false;
                }
            // ### SE SI USANO ALTRI BROWSER
            }else{
                try{
                    xmlHttp = new XMLHttpRequest();
                }catch     (e){
                        xmlHttp = false;
                }            
            }

            if    (!xmlHttp){
                alert("Errore durante la creazione dell'oggetto XMLHttpRequest");  
            }else{
                return xmlHttp;
            }
}



function     handleServerResponse(){
      
            var strNome = document.getElementById("txtNome").value;
            var strCognome = document.getElementById("txtCognome").value;
            var strEmail = document.getElementById("txtEmail").value;
            var strData = "";
            
            var strData = "txtNome=" + strNome + "&txtCognome=" + strCognome + "&txtEmail=" + strEmail;
            
            xmlhttp.open("POST", "data.php", true);


            xmlhttp.onreadystatechange = function()  {
                    if (xmlhttp.readyState==4){
                        if    (xmlhttp.status==200)   {
                        alert(xmlhttp.readyState + "\n" + xmlhttp.status + "\n" + xmlhttp.responseText);
                        var boxId=document.getElementById("boxForm");
                        boxId.innerHTML=xmlhttp.responseText;
                        }
                    }
                }
                
            //Send the proper header information along with the request
            xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xmlhttp.setRequestHeader("Content-length", strData.length);
            xmlhttp.setRequestHeader("Connection", "close");
            
            xmlhttp.send(strData);
}

Pagina data.php

<?php
echo "ecco i dati";
print_r($_POST);
?>

Questo codice non funziona. All'invio del form la pagina resta uguale a prima con i campi svuotati.
Se invece metto un alert() nella funzione interna (quella assegnata a xmlhttp.onreadystatechange) compare una finestra alert() e poi al posto del form viene stampato il risultato della pagina php. Quale è il problema? Grazie a chi mi risponderà

[cavicchiandrea]

Prova ad usare questo codice che è più snello e non setta header

[Nunkij]

Ma io ho bisogno di inviare dati via POST non via GET

[cavicchiandrea]

var strData ="txtNome="+ strNome +"&txtCognome="+ strCognome +"&txtEmail="+ strEmail;
xmlhttp.open("POST","data.php",true);
xmlhttp.send(strData);

[Nunkij]

Non ho capito la tua risposta

[cavicchiandrea]

Non ho capito la tua risposta

usi il codice che t'ho consigliato sostituendo la chiamata da GET a POST (vedi codice precedente)

[Nunkij]

Sul sito del w3c schools, e su altri tutorial, spiega che nella chiamata con il metodo POST vanno settati gli header, e per qualche motivo che non mi è chiaro mi consigliavi di non farlo.
Comunque la domanda è come è possibile che se io aggiungo un alert funziona tutto e se non lo aggiungo no. Non capisco la logica di questo comportamento dell'applicazione.

[cavicchiandrea]

Sul sito del w3c schools, e su altri tutorial, spiega che nella chiamata con il metodo POST vanno settati gli header, e per qualche motivo che non mi è chiaro mi consigliavi di non farlo.

Per esperienza non mai settato gli header (quello che da più problemi e setRequestHeader("Connection","close") perché non e "interpretato" in egual maniera dai browser

Comunque la domanda è come è possibile che se io aggiungo un alert funziona tutto e se non lo aggiungo no. Non capisco la logica di questo comportamento dell'applicazione.

Probabilmente è perché dai un return alla funzione ajax e inserendo un alert hai un ritorno dalla funzione, comunque se il codice che t'ho segnalo funziona non farti troppe domande e usa quello

[Nunkij]

A quanto mi par di capire la differenza tra il tuo codice e il mio è la rimozione di tutti gli header. Giusto? Facendo così non funziona.
Tuttavia penso che il problema sia nella funzione assegnata a:xmlhttp.onreadystatechange

infatti, come dicevo all'inizio se inserisco l'alert fila tutto liscio. Se invece inserisco i return al posto dell'alert non va!
NNon riesco a capire il problema ancora

[cavicchiandrea]

Non so dati spiegazioni in merito, e visto che insisti con il tuo codice (giustamente) ti lascio riflette con calma come sistemare il codice augurandoti di risolvere.