ajax a cascata

**musica1000w** · 06-07-2010, 16:06

Ciao ragazzi...non è che sto capendo molto bene il funzionamento di ajax per questo vi posto il mio problema...diciamo che so adoperare questo sistema per una sola riga di scelta...esempio nel campo fatture scelgo l'anno e mi escono i possibili numeri di quell'anno.
Ma se volessi fare dei menù a tendina in cascata? il problema ora è il seguente:
Scegliere casa costruttrice ---> modello ---> targa il primo step da casa costruttrice e modello ok...solo che non so come mettere ora la targa...
come dovrei operare?!?

Il codice del primo passaggio è il seguente:
<script type="text/javascript">
function showUser(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// per i browser IE7+ Firefox Chrome Safari Opera
xmlhttp=new XMLHttpRequest();
}
else
{// per i browser IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlht tp.responseText;
}
}
xmlhttp.open("GET","getmodello.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<h3>Scegliere Modello Autoveicolo</h3>
<form name="modello" action="form5.php" method="post">
<table border="0">
<tr>
<td>Casa Costruttrice:</td>
<td>
<select name="casa" onChange="showUser(this.value)">
<?php
$risultato=mysql_query("SELECT Casa_Costruttrice FROM autoveicolo GROUP BY Casa_Costruttrice ASC", $db) or die("Errore query");
$i=1;
while($vet=mysql_fetch_array($risultato)) {
$a[$i]=$vet[0];
$i++;
}
echo "<option value\"\">seleziona</option>";
for($c=1;$c<=count($a);$c++){
echo "<option value=\"$a[$c]\">$a[$c]</option>";
}
echo "</select>";
?>
</td>
</tr>
<tr>
<td>Modello:</td>
<td>
<div id="txtHint"><select></select></div>
</td>
</tr>

dove ajax lavore con questo codice di getmodello:

<?php
require("connessione.php");
$q=$_GET["q"];
$ris=mysql_query("SELECT Modello FROM autoveicolo WHERE Casa_Costruttrice='$q'", $db) or die("Errore 1");
echo "<select name=\"mod\">";
$i=1;
echo $q;
while($vet=mysql_fetch_array($ris)) {
$mod[$i]=$vet[0];
$i++;
}
for($c=1;$c<=count($mod);$c++){
echo "<option value=\"$mod[$c]\">$mod[$c]</option>";
}
echo "</select>";
?>

ora per inglobare la scelta della targa? come devo richiamare ajax? qualcuno sa dirmi come operare? grazie infinite

**musica1000w** · 06-07-2010, 17:46

scusate forse il tipolo doveva essere select in cascata

**cavicchiandrea** · 06-07-2010, 18:14

Studiati questa discussione l'esempio tratta Regioni > Provincie > Comuni ma il concetto non cambia e se vuoi approfondire per capire meglio (consigliato) ajax guida

**musica1000w** · 08-07-2010, 10:46

Si ma onestamente non ho capito moltissimo...o quantomeno non riesco ad applicarlo al mio caso...diciamo che riesco a farlo funzionare per 2/3 la terza select non so come richiamarla...se qualcuno di buon cuore mi puo fare una mano..

Il mio problema si presenta in questo modo...ci sono 3 select in cascata..

casa costruttrice
modello
targa

Selezionando la casa costruttrice mi escono i modelli delle macchine presenti nel database ora non so come scrivere la funzione per selezionare le targhe..

vi posto il codice php della pagina nella speranza quancuno possa dirmi come fare...grazie...

Codice PHP:


<html> <style type="text/css"> @import url("fogliostile.css"); </style> <head> <title>Cerca Autoveicolo</title> <script type="text/javascript"> function showmodello(str) { if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) {// per i browser IE7+ Firefox Chrome Safari Opera xmlhttp=new XMLHttpRequest(); } else {// per i browser IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getmodello.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <h3>[i]Scegliere Modello Autoveicolo[/i]</h3> <form name="modello" action="form5.php" method="post"> <table border="0"> <tr> <td>Casa Costruttrice:</td> <td> <select name="casa" onChange="showmodello(this.value)"> <?php $risultato=mysql_query("SELECT Casa_Costruttrice FROM autoveicolo GROUP BY Casa_Costruttrice ASC", $db) or die("Errore query"); $i=1; while($vet=mysql_fetch_array($risultato)) { $a[$i]=$vet[0]; $i++; } echo "<option value\"\">seleziona</option>"; for($c=1;$c<=count($a);$c++){ echo "<option value=\"$a[$c]\">$a[$c]</option>"; } echo "</select>"; ?> </select> </td> </tr> <td>Modello:</td> <td> <div id="txtHint"><select></select></div> </td> </tr> <tr> <td>Targa:</td> <td> <div id="txtHint"><select></select></div> </td> </tr> </table> <input type="submit" align="absmiddle" value="Visualizza"> </form> </body> </html>

nella pagina getmodello.php uso questo codice e cosi funziona tranquillamente:

Codice PHP:


<?php require("connessione.php"); $q=$_GET["q"]; $ris=mysql_query("SELECT Modello FROM autoveicolo WHERE Casa_Costruttrice='$q'", $db) or die("Errore 1"); echo "<select name=\"mod\">"; $i=1; echo $q; while($vet=mysql_fetch_array($ris)) { $mod[$i]=$vet[0]; $i++; } for($c=1;$c<=count($mod);$c++){ echo "<option value=\"$mod[$c]\">$mod[$c]</option>"; } echo "</select>"; ?>

dovrei creare una pagina gettarga.php affinchè in base al modello possa scegliere la targa e non credo che sia molto differente da getmodello.php
ma non so proprio come creare il secondo codice ajax in cascata al primo...spero che qualcuno possa dirmi come implementarlo grazie!!

**musica1000w** · 08-07-2010, 10:46

Si ma onestamente non ho capito moltissimo...o quantomeno non riesco ad applicarlo al mio caso...diciamo che riesco a farlo funzionare per 2/3 la terza select non so come richiamarla...se qualcuno di buon cuore mi puo fare una mano..

Il mio problema si presenta in questo modo...ci sono 3 select in cascata..

casa costruttrice
modello
targa

Selezionando la casa costruttrice mi escono i modelli delle macchine presenti nel database ora non so come scrivere la funzione per selezionare le targhe..

vi posto il codice php della pagina nella speranza quancuno possa dirmi come fare...grazie...

Codice PHP:


<html> <style type="text/css"> @import url("fogliostile.css"); </style> <head> <title>Cerca Autoveicolo</title> <script type="text/javascript"> function showmodello(str) { if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) {// per i browser IE7+ Firefox Chrome Safari Opera xmlhttp=new XMLHttpRequest(); } else {// per i browser IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getmodello.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <h3>[i]Scegliere Modello Autoveicolo[/i]</h3> <form name="modello" action="form5.php" method="post"> <table border="0"> <tr> <td>Casa Costruttrice:</td> <td> <select name="casa" onChange="showmodello(this.value)"> <?php $risultato=mysql_query("SELECT Casa_Costruttrice FROM autoveicolo GROUP BY Casa_Costruttrice ASC", $db) or die("Errore query"); $i=1; while($vet=mysql_fetch_array($risultato)) { $a[$i]=$vet[0]; $i++; } echo "<option value\"\">seleziona</option>"; for($c=1;$c<=count($a);$c++){ echo "<option value=\"$a[$c]\">$a[$c]</option>"; } echo "</select>"; ?> </select> </td> </tr> <td>Modello:</td> <td> <div id="txtHint"><select></select></div> </td> </tr> <tr> <td>Targa:</td> <td> <div id="txtHint"><select></select></div> </td> </tr> </table> <input type="submit" align="absmiddle" value="Visualizza"> </form> </body> </html>

nella pagina getmodello.php uso questo codice e cosi funziona tranquillamente:

Codice PHP:


<?php require("connessione.php"); $q=$_GET["q"]; $ris=mysql_query("SELECT Modello FROM autoveicolo WHERE Casa_Costruttrice='$q'", $db) or die("Errore 1"); echo "<select name=\"mod\">"; $i=1; echo $q; while($vet=mysql_fetch_array($ris)) { $mod[$i]=$vet[0]; $i++; } for($c=1;$c<=count($mod);$c++){ echo "<option value=\"$mod[$c]\">$mod[$c]</option>"; } echo "</select>"; ?>

dovrei creare una pagina gettarga.php affinchè in base al modello possa scegliere la targa e non credo che sia molto differente da getmodello.php
ma non so proprio come creare il secondo codice ajax in cascata al primo...spero che qualcuno possa dirmi come implementarlo grazie!!

**musica1000w** · 08-07-2010, 10:46

Si ma onestamente non ho capito moltissimo...o quantomeno non riesco ad applicarlo al mio caso...diciamo che riesco a farlo funzionare per 2/3 la terza select non so come richiamarla...se qualcuno di buon cuore mi puo fare una mano..

Il mio problema si presenta in questo modo...ci sono 3 select in cascata..

casa costruttrice
modello
targa

Selezionando la casa costruttrice mi escono i modelli delle macchine presenti nel database ora non so come scrivere la funzione per selezionare le targhe..

vi posto il codice php della pagina nella speranza quancuno possa dirmi come fare...grazie...

Codice PHP:


<html> <style type="text/css"> @import url("fogliostile.css"); </style> <head> <title>Cerca Autoveicolo</title> <script type="text/javascript"> function showmodello(str) { if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) {// per i browser IE7+ Firefox Chrome Safari Opera xmlhttp=new XMLHttpRequest(); } else {// per i browser IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getmodello.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <h3>[i]Scegliere Modello Autoveicolo[/i]</h3> <form name="modello" action="form5.php" method="post"> <table border="0"> <tr> <td>Casa Costruttrice:</td> <td> <select name="casa" onChange="showmodello(this.value)"> <?php $risultato=mysql_query("SELECT Casa_Costruttrice FROM autoveicolo GROUP BY Casa_Costruttrice ASC", $db) or die("Errore query"); $i=1; while($vet=mysql_fetch_array($risultato)) { $a[$i]=$vet[0]; $i++; } echo "<option value\"\">seleziona</option>"; for($c=1;$c<=count($a);$c++){ echo "<option value=\"$a[$c]\">$a[$c]</option>"; } echo "</select>"; ?> </select> </td> </tr> <td>Modello:</td> <td> <div id="txtHint"><select></select></div> </td> </tr> <tr> <td>Targa:</td> <td> <div id="txtHint"><select></select></div> </td> </tr> </table> <input type="submit" align="absmiddle" value="Visualizza"> </form> </body> </html>

nella pagina getmodello.php uso questo codice e cosi funziona tranquillamente:

Codice PHP:


<?php require("connessione.php"); $q=$_GET["q"]; $ris=mysql_query("SELECT Modello FROM autoveicolo WHERE Casa_Costruttrice='$q'", $db) or die("Errore 1"); echo "<select name=\"mod\">"; $i=1; echo $q; while($vet=mysql_fetch_array($ris)) { $mod[$i]=$vet[0]; $i++; } for($c=1;$c<=count($mod);$c++){ echo "<option value=\"$mod[$c]\">$mod[$c]</option>"; } echo "</select>"; ?>

dovrei creare una pagina gettarga.php affinchè in base al modello possa scegliere la targa e non credo che sia molto differente da getmodello.php
ma non so proprio come creare il secondo codice ajax in cascata al primo...spero che qualcuno possa dirmi come implementarlo grazie!!

**cavicchiandrea** · 08-07-2010, 11:30

A) Non postare codice php non tutti lo conosco ed è irrilevate x ajax/javascript
B) Il codice non tutto su una riga peggiora di molto la lettura
C) Che conoscenza hai di ajax?
D) Meglio se metti un link alla pagina demo, spesso vedere l'applicativo in funzione da la svolta risolutiva
F) Il php sei sicurissimo che sia corretto e funzionante, per capirci se richiami le pagine senza ajax in modo tradizionale il tutto funziona?

Questa frase suona strana:ma non so proprio come creare il secondo codice ajax in cascata al primo...spero che qualcuno possa dirmi come implementarlo grazie!!
normalmente non è necessario richiamare una seconda funzione ajax a seguito della prima, cosa non hai capito dell'esempio delle select a cascata? L'hai studiata?

**musica1000w** · 08-07-2010, 12:23

Scusate avevo avuto un problema con la linea e ha postato la mia risposta 3 volte!
Premetto che ajax non lo conosco e sto cercando di usarlo solo in questa applicazione, ho cercato di capire quella dell'altra discussione ma è in parte differente dal codice che ho usato per 2 select in cascata.
Scusate se il codice l'ho postato su di una riga ma è lo stesso identico della mia prima domanda, come faccio a mettere il link alla pagina demo?
nell'esempio che mi hai fatto notare mi sembra che chiama 3 volte la funzione per ogni tabella...continente nazione regione o una cosa del genere quindi non richiama 3 volte la funzione?
Io il codice non l'ho capito più che altro e non lo riesco a mettere in relazione al mio.

Riposto spero in una maniera più comprensibile:
Nella pagina cercaMODELLO.php inizio dopo il richiamo della connessione con il codice javascript:

<script type="text/javascript">
function showmodello(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// per i browser IE7+ Firefox Chrome Safari Opera
xmlhttp=new XMLHttpRequest();
}
else
{// per i browser IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlht tp.responseText;
}
}
xmlhttp.open("GET","getmodello.php?q="+str,true);
xmlhttp.send();
}
</script>

Questo codice non dovrebbe far altro che selezionata la casa costruttrice va a fare l'operazione presente nel getmodello.php

e la selezione della casa costruttrice che si trova dopo il codice ajax è il seguente:

<form name="modello" action="form5.php" method="post">
<table border="0">
<tr>
<td>Casa Costruttrice:</td>
<td>
<select name="casa" onChange="showmodello(this.value)">
<?php
$risultato=mysql_query("SELECT Casa_Costruttrice FROM autoveicolo GROUP BY Casa_Costruttrice ASC", $db) or die("Errore query");
$i=1;
while($vet=mysql_fetch_array($risultato)) {
$a[$i]=$vet[0];
$i++;
}
echo "<option value\"\">seleziona</option>";
for($c=1;$c<=count($a);$c++){
echo "<option value=\"$a[$c]\">$a[$c]</option>";
}
echo "</select>";
?>
</select>
</td>
</tr>
<td>Modello:</td>
<td>
<div id="txtHint"><select></select></div>
</td>
</tr>

mentre il codice presente nel getmodello.php è il seguente:

<?php
require("connessione.php");
$q=$_GET["q"];
$ris=mysql_query("SELECT Modello FROM autoveicolo WHERE Casa_Costruttrice='$q'", $db) or die("Errore 1");
echo "<select name=\"mod\">";
$i=1;
while($vet=mysql_fetch_array($ris)) {
$mod[$i]=$vet[0];
$i++;
}
for($c=1;$c<=count($mod);$c++){
echo "<option value=\"$mod[$c]\">$mod[$c]</option>";
}
echo "</select>";
?>

Con questi passaggi io riesco a fare 2 select in cascata...infatti seleziono la casa costruttrice e mi escono i modelli disponibili nel db riferiti a quella casa costruttrice.

Credo ora di dover creare un'altra funzione tipo function showtarga(asd) ecc ecc che mi fa la ricerca della targa in base alla selezione della casa costruttrice e del modello che ovviamente dovrebbe indirizzare in un'altra pagina tipo gettarga.php che dovrebbe fare lo stesso discorso di getmodello.php nella ricerca della targa ed inserirla nella pagina madre tipo in questo modo:

<tr>
<td>Targa:</td>
<td>
<div id="???"><select></select></div>
</td>
</tr>

In pratica non so se per function showtarga(asd) devo usare lo stesso tipo di codice di showmodello(str) o è differente il codice che dovrei mettere. Non so se sono stato chiaro e se non sto rompendo...l'ajax non l'ho capito evidentemente bene e quindi non so cosa modificare nella seconda funzione...nell'esempio che mi hai fatto presente vedo che usa in maniera diversa le funzioni quindi non so come adattarle al mio caso...scusate ancora..

**musica1000w** · 09-07-2010, 11:57

Ragazzi sto rincretinendo e non poco con questo ajax!!!
ho provato diverse modifiche ma non riesco ad aggiornare la 3° select.
Ho provato a modificare in questo modo:

<html>
<style type="text/css">
@import url("fogliostile.css");
</style>
<head>
<title>Cerca Autoveicolo</title>
<script type="text/javascript">
function showmodello(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// per i browser IE7+ Firefox Chrome Safari Opera
xmlhttp=new XMLHttpRequest();
}
else
{// per i browser IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlht tp.responseText;
}
}
xmlhttp.open("GET","getmodello.php?q="+str,true);
xmlhttp.send();
}
function showtarga(asc)
{
if (asc=="")
{
document.getElementById("txtHint1").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// per i browser IE7+ Firefox Chrome Safari Opera
xmlhttp=new XMLHttpRequest();
}
else
{// per i browser IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint1").innerHTML=xmlh ttp.responseText;
}
}
xmlhttp.open("GET","gettarga.php?w="+asc,true);
xmlhttp.send();
}
</script>
</head>
<body>
<h3>Scegliere Modello Autoveicolo</h3>
<form name="modello" action="form5.php" method="post">
<table border="0">
<tr>
<td>Casa Costruttrice:</td>
<td>
<select name="casa" onChange="showmodello(this.value)">
<?php
$risultato=mysql_query("SELECT Casa_Costruttrice FROM autoveicolo GROUP BY Casa_Costruttrice ASC", $db) or die("Errore query");
$i=1;
while($vet=mysql_fetch_array($risultato)) {
$a[$i]=$vet[0];
$i++;
}
echo "<option value\"\">seleziona</option>";
for($c=1;$c<=count($a);$c++){
echo "<option value=\"$a[$c]\">$a[$c]</option>";
}
?>
</select>
</td>
</tr>
<td>Modello:</td>
<td>
<div id="txtHint"><select name="mod" onChange="showtarga(this.value)"></select></div>
</td>
</tr>
<tr>
<td>Targa:</td>
<td>
<div id="txtHint1"><select name="tar"></select></div>
</td>
</tr>
</table>
<input type="submit" align="absmiddle" value="Visualizza">
</form>
</body>
</html>

dove in getmodello.php ho messo questo codice:

<?php
require("connessione.php");
$q=$_GET["q"];
$ris=mysql_query("SELECT Modello FROM autoveicolo WHERE Casa_Costruttrice='$q'", $db) or die("Errore 1");
echo "<select name=\"mod\">";
$i=1;
while($vet=mysql_fetch_array($ris)) {
$mod[$i]=$vet[0];
$i++;
}
for($c=1;$c<=count($mod);$c++){
echo "<option value=\"$mod[$c]\">$mod[$c]</option>";
}
echo "</select>";
?>

e in gettarga.php ho messo quest'altro codice:

<?php
require("connessione.php");
$w=$_GET["w"];
$ris=mysql_query("SELECT Targa FROM autoveicolo WHERE Modello='$w'", $db) or die("Errore 1");
echo "<select name=\"tar\">";
$i=1;
while($vet=mysql_fetch_array($ris)) {
$tar[$i]=$vet[0];
$i++;
}
for($c=1;$c<=count($tar);$c++){
echo "<option value=\"$tar[$c]\">$tar[$c]</option>";
}
echo "</select>";
?>

Anche in questo modo riesco ad aggiornale la 2° select in base alla 1° ma la 3° non riesco proprio ad aggiornarla con le targhe dei modelli!

qualcuno può dirmi dove sbaglio? grazie infinite!

**musica1000w** · 12-07-2010, 13:52

Scusate se insisto ma nessuno riesce a dirmi cosa sbaglio nel richiamo della terza select?

Discussione: ajax a cascata

Strumenti discussione

Ricerca discussione

Visualizza

ajax a cascata

Forse meglio parlare di select in cascata

Permessi di invio