Salve, ho provato a fare una form alla seguente pagina:
http://angelodiiorio.altervista.org/...ntent=contacts
il problema è il seguente: mentre con chrome e FF (e sembra anche con Explorer 8 e 6, ma non ho avuto modo di fare test ripetuti e approfonditi) funziona tutto alla grande, con Explorer 7 alle volte (non sempre) readyState non cambia il proprio valore e resta fisso ad 1, salvo poi cambiare dopo diversi minuti se lascio la pagina "al suo destino" (ma in quel caso, non mi vengono prelevati i valori dai campi della form e la mail che mi viene spedita risulta vuota). Inoltre sempre su Explorer le animazioni jQuery non funzionano quando viene aperto il sito, ma in compenso funzionano quelle inserite nella pagina dove c'è la form. (al fine di non rendere le animazioni antipatiche, c'è un cookie che se settato, non fa visualizzare l'animazione; tale cookie vive 20 minuti)
Per "aiutarvi" (e aiutare me) ho lasciato degli alert nella pagina che mi scrivono mano mano lo stato che valore ha.
Di seguito c'è parte del codice dell'index.php, dove importo i vari script:
codice:
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Dott.ssa Angela Cassese</title> <meta name="keywords" content="dieta, nutrizionista, benessere, peso in eccesso, dimagrire" />
<meta name="description" content="" />
<link href="default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/form.js"></script>
<script type="text/javascript" src="scripts/animation.js"></script>
</head>
<body onload="animation();">
Questo è il codice della form, con i div usati per comunicare con l'utente dopo l'invio della form:
codice:
<table width="750" border="0" align="center" cellpadding="0" cellspacing="0">
<form name="mail" action="javascript:get(document.getElementById('mail'));" id="mail" method="post">
<tr>
<td class="text2">Mandaci una e-mail</td>
</tr>
<tr>
<td class="text3">compila la seguente form</td>
</tr>
<tr> <td class="bg3">[img]images/spacer.gif[/img]</td> </tr>
<tr> <td></td> </tr>
<tr> <td>
<table align="left">
<tr> <td> Nome </td> <td> <input type="text" name="name" id="name" size="32" /> </td> </tr>
<tr> <td> Cognome </td> <td> <input type="text" name="surname" id="surname" size="32" /> </td> </tr>
<tr> <td> Indirizzo e-mail </td> <td> <input type="text" name="email" id="email" size="32" /> </td> </tr>
<tr> <td> Contenuto della e-mail </td> <td> <textarea name="body" cols="30" id="body" rows="5"></textarea> </td> </tr>
<tr> <td colspan="2" align="center"> <input style="color:#000000;" type="button" value="Invia" onclick="check();" /> </td> </tr>
</table>
</td> </tr>
</form>
<tr> <td>
<div class="text3" id="wait" style="display:none;"></div> <div class="text2" id="response" style="display:none;"> <div id="information"></div> </div> </td> </tr> </table>
Questo è il codice JS usato per inoltrare i dati della form:
Codice PHP:
var http_request = false; function makePOSTRequest(url, parameters)
{
http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) { // set type accordingly to anticipated content type //http_request.overrideMimeType('text/xml');
http_request.overrideMimeType('text/html'); } }
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 = alertContents;
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.setRequestHeader("Cache-Control", "no-cache"); http_request.send(parameters); }
function alertContents() { alert('readyState adesso vale ' + http_request.readyState);
if (http_request.readyState == 1)
{
jQuery('#response').slideUp(1000); document.getElementById('wait').innerHTML = '
Sto inoltrando...</p>';
jQuery('#wait').slideDown(1000);
}
else if (http_request.readyState == 4)
{
if (http_request.status == 200) { jQuery('#wait').slideUp(1000); document.getElementById('information').innerHTML = http_request.responseText; jQuery('#response').slideDown(1000);
} else { alert('There was a problem with the request.'); } } } function get(obj) { var poststr = "name=" + encodeURI( document.getElementById("name").value ) + "&surname=" + encodeURI( document.getElementById("surname").value ) + "&email=" + encodeURI( document.getElementById("email").value ) + "&body=" + encodeURI( document.getElementById("body").value); makePOSTRequest('mail.php', poststr); } function check() { with(document.mail) { if(name.value == "") { alert('ATTENZIONE: compila correttamente il campo "Nome"'); name.focus(); } else if(surname.value == "") { alert('ATTENZIONE: compila correttamente il campo "Cognome"'); surname.focus(); } else if(email.value == "" || email.value.indexOf("@") == -1 || email.value.indexOf(".") == -1) { alert('Verifica la correttezza del campo "mail"'); email.focus(); } else if(body.value == "") { alert('Inserisci il corpo della mail, grazie'); body.focus(); } else { get(document.getElementById('mail')); } } }
Questo è il codice di mail.php
Codice PHP:
<?php if(!isset($_POST)) die("Cannot access this page directly");
$message = "Nome e cognome: ". $name . " " . $surname . "\nEmail: " . $email . "\n\nContenuto del messaggio: " . $body . "\n\nFine della email\n"; mail("...","Mail proveniente dal sito",$message,"From: " . $name . " " . $surname . "<". $email . ">\n"); mail($email,"Auto-responder","ATTENZIONE: messaggio automatico, non rispondere a questa mail.\n\nLa vostra e-mail è stata correttamente inviata.","From: Dott.ssa Angela Cassese <...>\n"); echo("[b]LA MAIL È STATA CORRETTAMENTE INVIATA[/b]"); ?>
Infine questo è il codice usato per le chiamate jQuery che non funzionano su explorer
Codice PHP:
function pause(millis) { var date = new Date(); var curDate = null; do { curDate = new Date(); } while(curDate-date < millis); }; function animation() { jQuery("#image").fadeIn(2000); pause(500); jQuery("#content").slideDown(3000); };
ho provato a ri-formattare un po' il testo dei vari script, ma credo vi convenga vedere direttamente i sorgenti on line che sono senz'altro più chiari poiché formattati. Grazie mille a tutti.