Eseguire script ajax nella stessa pagina index.php

  • Creatore Discussione Creatore Discussione CIMO
  • Data di inizio Data di inizio

CIMO

Nuovo Utente
8 Apr 2007
18
0
0
Ciao a tutti ho un problema a capire bene il funzionamento di ajax, prima vi spiego il tutto e poi posto il codice
Allora, io ho una normalisissima e semplicissima pagina .php con dentro solo il form di invio mail e le variabili php in $_POST[''] (sopra sta il php e sotto il form html)
Ora ho scritto questo in un file esterno .js
Codice:
// AJAX
function GetXmlHttpObject()
{
	if (window.XMLHttpRequest)
	{
		// IE7+, Firefox, Chrome, Opera, Safari
		return new XMLHttpRequest();
	}
	
	if (window.ActiveXObject)
	{
		// IE5, IE6
		return new ActiveXObject("Microsoft.XMLHTTP");
	}
	
	return null;
}

function submitFormWithAjax()
{
	var ajaxRequest = new GetXmlHttpObject();

	var checkFormSendMail = document.formSendMail.checkFormSendMail.value;
	var sender = document.formSendMail.sender.value;
	var sendTo = document.formSendMail.sendTo.value;
	var subject = document.formSendMail.subject.value;
	var textMessage = document.formSendMail.textMessage.value;
	var captcha = document.formSendMail.captcha.value;

	var parameters = "checkFormSendMail=" + checkFormSendMail + "&sender=" + sender + "&sendTo=" + sendTo + "&subject=" + subject + "&textMessage=" + textMessage
						+ "&captcha=" + captcha;

	ajaxRequest.open("POST", "index.php", true);
	ajaxRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	ajaxRequest.send(parameters);
	
	ajaxRequest.onreadystatechange = function()
	{
		if (ajaxRequest.readyState == 4)
		{
			if (ajaxRequest.status == 200)
			{
				document.getElementById("divFormMail").innerHTML = ajaxRequest.responseText;
			
				//document.getElementById("divUploadFile").style.display = "none";
			}
			else
			{
				document.getElementById("divFormMail").innerHTML = "An error has occured making the request";
			}
		}
		else
		{
			document.getElementById("divFormMail").innerHTML = '<img src="img/Loading.gif"> Loading Content...';
		}
	}
}
// AJAX
Di funzionare funziona solo che mi spara l'intera pagina nel div invece, vorrei fare in modo che una volta che premo il pulsante nella stessa pagina index mi rimangono le variabili negli imput e senza che mi ridia tutta la pagina index nel div mi invii semplicemente la mail....
Come devo fa'?
 
Nothing? ... come devo fa' che sto' uscendo pazzo...
Ho una pagina index.php con dentro il richiamo alla classe send mail con un new SendMail()
Poi ho una pagina sendMail.php con un richiamo alla classe send mail con un altro new SendMail()
Nel file index.js faccio indirizzare dal form di index.php a pagina sendMail.php e invia correttemente le variabili e sempre nel file index.js dico di nascondere il form in modo che mi visualizza il testo contenuto in sendMail.php (che nn e' altro che un echo delle variabili $_POST['']) al posto dei campi di input del fomr di pagina index.php
Le mail le invia solo che in index.php ho un richiamo alla funziona toLog() della classe send mail...ma in index nn mi vede una mazza xke nn mi riconosce le variabili in toLog()..se invece metto toLog() nel file sendMail.php li funziona...ma poco mi serve xke nn riesco a piazzarlo nella index....sara' peche ho usato un new SendMail() in index.php e uno in success.php?
Vi posto il codice delle due pagina php + il js e vi prego aiutatemi.....nn ci riesco da solo....

index.php
Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?php
require("db.php");
require("Class/SendMail.class.php");

$SendMail = new SendMail();
?>
<html>
	<head>
		<!-- no cache headers -->
		<meta http-equiv="Pragma" content="no-cache"></meta>
		<meta http-equiv="Expires" content="-1"></meta>
		<meta http-equiv="Cache-Control" content="no-cache"></meta>
		<!-- end no cache headers -->
		<title><?php echo $siteName; ?></title>
		<link rel="stylesheet" type="text/css" href="Css/Style1.css"></link>
		<script src="Js/Index.js"></script>
	</head>
	<body>
		<div id="divHeader">
			<h1 id="hSiteName"><?php echo $siteName; ?></h1>
		</div>
		<div id="divCenter">
			<div id="divInformation" class="overflow_scroll">
				<h1 id="hInformation">Informazioni</h1>
				<p id="pInformation">
					<?php echo $SendMail->toInformation(); ?>
				</p>
			</div>
			<div id="divLog" class="overflow_scroll">
				<h1 id="hLog">Log</h1>
				<p id="pLog">
					<?php echo $SendMail->toLog(); ?>
				</p>
			</div>
			<div id="divFormMail">
				<form id="formSendMail" name="formSendMail">
					<input type="hidden" name="checkFormSendMail" value="ok"></input>
					
					<p id="pSender">Mittente:</p>
					<input id="inputSender" name="sender" value="" type="text" tabindex="1"></input>
					<?php  ?>
					
					<p id="pTo">Destinatario / i:</p>
					<input id="inputSendTo" name="sendTo" value="" type="text" tabindex="2"></input>
					
					<p id="pSubject">Soggetto:</p>
					<input id="inputSubject" name="subject" value="" type="text" tabindex="3"></input>
					
					<p id="pMessage">Messaggio:</p>
					<textarea id="textareaMessage" name="textMessage" value="" type="text" tabindex="4"></textarea>
					
					<p id="pCaptcha">Codice:</p>
					<input id="inputCaptcha" name="captcha" value="" type="text" tabindex="5"></input>
					<img id="imgCaptcha" src="Captcha.php"></img>
					
					<button id="buttonSend" name="buttonSend" type="button" onClick="submitFormWithAjax();" tabindex="6">Invia</button>
					<button id="buttonReset" name="buttonReset" type="reset" tabindex="7">Reset form</button>
				</form>
				<button id="buttonReload" name="buttonReload" type="button" onClick="parent.location='<?php echo $siteUrl; ?>';" tabindex="8">Ricarica pagina</button>
			</div>
			<div id="divUploadFile">
				<form id="formUploadFile" name="formUploadFile" method="POST" action="<?php echo $siteUrl . "/index.php"; ?>" enctype="multipart/form-data">
					<input type="hidden" name="checkFormUploadFile" value="ok"></input>
					
					<p id="pUploadFile">Allegato:</p>
					<input id="inputUploadFile" class="hidden" name="uploadFile" type="file" onChange="toNameUploadFile(this.value);"></input>
					
					<input id="inputUploadFileFake" name="inputUploadFileFake" value="Nessun allegato" type="text"></input>
					<button id="buttonUploadFileFake" name="buttonUploadFileFake" type="button" onClick="toOpenUploadFile('inputUploadFile');" tabindex="9">Sfoglia</button>
					
					<button id="buttonAttach" name="buttonAttach" type="submit" tabindex="10">Allega</button>
				</form>
			</div>
		</div>
		<div id="divFooter">
			<p id="pPowered">Powered by: <a class="pPowered" href="<?php echo $poweredUrl; ?>" target="_blank"><?php echo $poweredUrl; ?></a> - <a class="pPowered" href="mailto:<?php echo $poweredMail; ?>"><?php echo $poweredMail; ?></a></p>
		</div>
	</body>
</html>

sendMail.php
Codice:
<?php
session_start();

require("Class/SendMail.class.php");

$SendMail = new SendMail();

//$SendMail->toAttachment($_POST["checkFormUploadFile"], $_FILES["uploadFile"]["tmp_name"], $_FILES["uploadFile"]["name"], $_FILES["uploadFile"]["type"], $_FILES["uploadFile"]["size"]);

//echo "checkFormSendMail: " . $_POST["checkFormSendMail"] . "<br>";
//echo "sender: " . $_POST["sender"] . "<br>";
//echo "sendTo: " . $_POST["sendTo"] . "<br>";
//echo "subject: " . $_POST["subject"] . "<br>";
//echo "textMessage: " . $_POST["textMessage"] . "<br>";
//echo "captcha: " . md5($_POST["captcha"]) . " - " . $_SESSION['randomMd5'] . "<br>";

$SendMail->toSend($_POST["checkFormSendMail"], $_POST["sender"], $_POST["sendTo"], $_POST["subject"], $_POST["textMessage"], $_POST["captcha"], $_SESSION['randomMd5']);
?>

index.js
Codice:
// AJAX
function GetXmlHttpObject()
{
	if (window.XMLHttpRequest)
	{
		// IE7+, Firefox, Chrome, Opera, Safari
		return new XMLHttpRequest();
	}
	
	if (window.ActiveXObject)
	{
		// IE5, IE6
		return new ActiveXObject("Microsoft.XMLHTTP");
	}
	
	return null;
}

function submitFormWithAjax()
{
	var ajaxRequest = new GetXmlHttpObject();

	var checkFormSendMail = document.formSendMail.checkFormSendMail.value;
	var sender = document.formSendMail.sender.value;
	var sendTo = document.formSendMail.sendTo.value;
	var subject = document.formSendMail.subject.value;
	var textMessage = document.formSendMail.textMessage.value;
	var captcha = document.formSendMail.captcha.value;

	var parameters = "checkFormSendMail=" + checkFormSendMail + "&sender=" + sender + "&sendTo=" + sendTo + "&subject=" + subject + "&textMessage=" + textMessage
						+ "&captcha=" + captcha;

	ajaxRequest.open("POST", "SendMail.php", true);
	ajaxRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	ajaxRequest.send(parameters);
	
	ajaxRequest.onreadystatechange = function()
	{
		if (ajaxRequest.readyState == 4)
		{
			if (ajaxRequest.status == 200)
			{
				document.getElementById("divFormMail").innerHTML = ajaxRequest.responseText;
			
				document.getElementById("divUploadFile").style.display = "none";
			}
			else
			{
				document.getElementById("divFormMail").innerHTML = "An error has occured making the request";
			}
		}
		else
		{
			document.getElementById("divFormMail").innerHTML = '<img src="img/Loading.gif"> Loading Content...';
		}
	}
}
// AJAX

Vorrei fare in modo come detto sempre che premo su invia e in index mi fa vedere le variabili degli input del form...
 

Discussioni simili