Untitled

Il programma JavaScript, alla pressione dell’uno o dell’altro pulsante, richiede al programma PHP un vettore di dati. Dopo averli ricevuti lo visualizza.
Si possono vedere le richieste col metodo GET ed un parametro.
<!doctype html>
<head>
   <meta charset="UTF-8">
   <title>Esempio JSON - PHP</title>
</head>
<body>
<h1 id="premi">Gli oggetti da sogno degli studenti della 5<sup>a</sup>D</h1>
<button id="premi1">Vettore classico</button>
<button id="premi2">Vettore associativo</button>
<h2 id="mess"></h2>
<ul id="elenco">
<script>
function acquisisciClassico() {
    document.getElementById("mess").innerHTML = "Vettore classico";
    var richiesta = new XMLHttpRequest();
    richiesta.onreadystatechange = function() {
   	if(this.readyState == 4 && this.status == 200) {
   	   var elementi = JSON.parse(this.responseText);
   	   for(var i=0; i<elementi.length;i++) {
   	  	var voceLista = document.createElement("li");
   	  	var testoVoce = document.createTextNode(elementi[i]);
   	  	voceLista.appendChild(testoVoce);
         	document.getElementById("elenco").appendChild(voceLista);
   	   }
   	}
    };
    richiesta.open("GET", "datiJson.php?metodo=1", true);
    richiesta.send();
}
function acquisisciAssociativo() {
    document.getElementById("mess").innerHTML = "Vettore associativo";
    var richiesta = new XMLHttpRequest();
    richiesta.onreadystatechange = function() {
   	if(this.readyState == 4 && this.status == 200) {
   	   var elementi = JSON.parse(this.responseText);
   	   console.log(elementi);
   	   for(var i=0; i<elementi.length;i++) {
   	  	var voceLista = document.createElement("li");
   	  	var testoVoce = document.createTextNode(elementi[i].computer);
   	  	voceLista.appendChild(testoVoce);
         	document.getElementById("elenco").appendChild(voceLista);
   	   }
   	}
    };
    richiesta.open("GET", "datiJson.php?metodo=2", true);
    richiesta.send();
}
document.getElementById("premi1").addEventListener("click", acquisisciClassico);
document.getElementById("premi2").addEventListener("click", acquisisciAssociativo);
</script>
</ul>
</body>
Il programma php, letta la richesta, fornisce la prima o la seconda informazione
<?php
if($_GET['metodo']==1) {
   $sogni = array('MacBook Pro','Alfa Romeo Giulia','California','Natale');
} else {
	$sogni = array('Star','Alfa Romeo Giulia','California','Natale');
}
echo json_encode($sogni);
?>