PHP e modifica pagina in diretta

**TRAX3D** · 28-06-2012, 11.23.40

Salve vorrei sapere se è possibile con PHP fare qualcosa del genere:

tryjs_events

Cioè cambiare del testo sulla pagina in diretta come il nell'esempio sopra o PHP necessita per forza che la pagina sia rigenerata?
Grazie

28-06-2012, 11.29.39

Quello che vedi non è PHP ma JavaScript.

Con PHP agisci lato server e quindi (in generale) la pagina una volta creata quella è. Se vuoi modificarla devi usare un linguaggio che agisca sul client (JavaScript).

Una tecnica che permette di unire i due (PHP e JS) è AJAX. Nel particolare usando JS invii ad un server una richiesta. Il server la elabora (e quindi esegue, se è il caso il codice PHP) e restituisce un risultato. Lo script che ha iniziato la comunicazione agisce di conseguenza e quando serve modifica la pagina.

**TRAX3D** · 28-06-2012, 12.14.44

Quindi se volessi fare un pulsante che legge dei dati in inputbox e scrive a video il risultato di operazioni matematiche senza cambiare pagina o uso JS oppure per usare PHP devo usare AJAX.
I calcoli che devo fare non sono complicati seconto te è meglio che imparo quel minimo di JS che mi serve oppure è facile integrare AJAX, visto che conosco poco entrambi?
il problema è che PHP essendo lato server mi nascondeva tutte le formule usate invece il codice JS è visibile in nel source della pagina HTML gisuto?
Ora provo a dare un'occhiata a AJAX

28-06-2012, 12.16.49

Se vuoi nascondere i calcoli, si invia i dati ad una pagina php (tramite ajax) e poi scrivi il risultato restituito.

**TRAX3D** · 28-06-2012, 13.17.24

se qualcuno ha un po di pazienza...
ho cercato sul web
sto provando questo script AJAX + PHP ma non funziona dove sbaglio?

Codice HTML:

<!DOCTYPE html>
<html><head>
<script type="text/javascript">
function Calcola(strA, strB, strC)
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("ValoreTOT").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","gethint.php?A="+strA+"&B="+strB+"&C="+strC,true);
xmlhttp.send();
}
</script>
</head><body>

Valore di A: <input type="text" id="ValoreA"/><BR>
Valore di B: <input type="text" id="ValoreB"/><BR>
Valore di C: <input type="text" id="ValoreB"/><BR>


<button type="button" onclick="Calcola(ValoreA,ValoreB,ValoreC)">Calcola</button><BR>

Valore di TOT: <input type="text" id="ValoreTOT"/><BR>
<div id="ValoreTOT">Risultato...</div>

</body></html>

File PHP

Codice PHP:


<?php
//get the q parameter from URL
$A = $_GET["A"];
$B = $_GET["B"];
$C = $_GET["C"];

$response = $A + $B + $C;

//output the response
echo $response;
?>

28-06-2012, 13.42.20

Le richieste asincrone sono un po' ostiche, ecco perchè ti consiglio di appoggiarti a qualcosa che ti semplifichi le cose tipo jQuery.

Una volta caricata la libreria (jQuery) potresti usare qualcosa tipo (scritto di botto)

Codice PHP:


<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
    function calcola(strA, strB, strC) {
        $.get('gethint.php?A=' + strA + '&B=' + strB + '&C=' + strC, function(html) {
            $('#ValoreTOT').val(html);
        });
    }
</script>

</head>
<body>

Valore di A: <input type="text" id="ValoreA" /><br />
Valore di B: <input type="text" id="ValoreB" /><br />
Valore di C: <input type="text" id="ValoreB" /><br />

<button type="button" onclick="Calcola(ValoreA,ValoreB,ValoreC)">Calcola</button><BR>

Valore di TOT: <input type="text" id="ValoreTOT"/><br />

<div id="ValoreTOT">Risultato...</div>

</body>
</html>

**TRAX3D** · 28-06-2012, 15.59.54

Grazie ma purtroppo non funziona ,
per fortuna ho trovato questo e funziona
posto per i posteri

Codice HTML:

html>
<body>
<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function calcola(){
	var ajaxRequest;  // The variable that makes Ajax possible!
	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("Your browser broke!");
				return false;
			}
		}
	}
	// Create a function that will receive data sent from the server
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			var ajaxDisplay = document.getElementById('ajaxDiv');
			ajaxDisplay.innerHTML = ajaxRequest.responseText;
		}
	}
	var strA = document.getElementById('ValoreA').value;
	var strB = document.getElementById('ValoreB').value;
	var strC = document.getElementById('ValoreC').value;
	var queryString = "?A=" + strA + "&B=" + strB + "&C=" + strC;
	ajaxRequest.open("GET", "Calcolo.php" + queryString, true);
	ajaxRequest.send(null); 
}
//-->
</script>

<form name='myForm'>
Valore di A: <input type="text" id="ValoreA" /><br />
Valore di B: <input type="text" id="ValoreB" /><br />
Valore di C: <input type="text" id="ValoreC" /><br />
<input type='button' onclick='calcola()' value='Calcola' />
</form>
Risultato: <div id='ajaxDiv'>...</div>
</body>
</html>

con il file Calcolo.php

Codice PHP:


<?php

//Prendo i valori da URL

$tmpA = $_GET["A"];

$tmpB = $_GET["B"];

$tmpC = $_GET["C"];



//Eseguo il calcolo

$response = $tmpA + $tmpB + $tmpC;



//Emetto il risultato

echo $response;

?>

Discussione: PHP e modifica pagina in diretta

LinkBack

Strumenti discussione

Display

PHP e modifica pagina in diretta

Regole di scrittura