Originariamente inviata da
vic53
Ti sei spiegata...
Per fare quello che chiedi devi usare AJAX...
quando clicchi cul 2ndo radio devi chiamare una routine sul server che faccia la query con il parametro per la seconda classe.... e cosi via per le altre classi. La routine sul server deve creare la select completa e alla risposta il client deve caricare il codice di risposta dal server nella select con l'istruzione "innerhtml"...
Piu difficile a spiegarlo che a farlo se sei a digiuno di Ajax....posso aiutarti a scrivere il codice occorrente per il tuo problema.
Per aiutarti ti ho preparato due file che ho testato sul miio server...
la tabella Scuola che ho usato per test è composta da
id - numerico intero long
classe - numerico long
nome stringa
cognome stringa
il primo file l'ho chiamato menuClasse.asp ed è il seguente e utilizza una chiamata AJAX
codice:
<html>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>prima</title>
<head>
<script type="text/javascript">
function Attiva(classe) {
//alert(classe);
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("alunno").innerHTML = this.responseText;
}
};
xmlhttp.open("GET", "getClasse.asp?q=" + classe, true);
xmlhttp.send();
}
</script>
<style>
.flex-container {
display: -webkit-flex;
display: flex;
width: 100%;
height: 50px;
background-color: lightgrey;
justify-content: space-between;
}
.flex-item {
background-color: #66CCFF;
width: 150px;
height: 24px;
margin: 10px;
text-align:center;
border: 2px solid;
border-radius: 10px;
}
</style>
</head>
<body>
<div class="flex-container">
<div class="flex-item">prima <input type="radio" value="1" name="Classe" onclick="Attiva(this.value)"></div>
<div class="flex-item">seconda <input type="radio" value="2" name="Classe" onclick="Attiva(this.value)"></div>
<div class="flex-item">terza <input type="radio" value="3" name="Classe" onclick="Attiva(this.value)"></div>
<div class="flex-item">quarta <input type="radio" value="4" name="Classe" onclick="Attiva(this.value)"></div>
<div class="flex-item">quinta <input type="radio" value="5" name="Classe" onclick="Attiva(this.value)"></div>
</div>
<table>
<tr>
<td> ALUNNI </td>
<td><div id="alunno"></div>
</td>
</tr>
</table>
</body>
</html>
per quanto riguarda il subprogram sul server l'ho chiamatogetClasse.asp ed è il seguente
codice:
<%
dim q, str,SQL,conn,RS,DB,CurrentProject,nome,cognome,idt
'imposta il db appropriato...
DB="mdb-database/DB_test.mdb"
Set conn = Server.CreateObject("ADODB.Connection")
Set RS = Server.CreateObject("ADODB.Recordset")
'utilizzo il driver pe Access 2000/2003
CurrentProject = "Driver={Microsoft Access Driver (*.mdb, *.accdb)}; DBQ="& Server.MapPath(DB)
'Apro la connessione
conn.Open CurrentProject
'
' parametro classe selezionato da input radio via querystring
'
for i=1 to Request.QueryString("q").Count
q = Request.QueryString("q")(i)
next
str="<select id=""alunno"" size=""1"" tabindex=""1"" style=""width: 300px""><option value="""">scelta</option>"
'
' la variabile "str" verra caricata con il risultato della query
'
'
' la classe è identificata da un numero tipo 1, 2, 3, 4, 5
' per il tipo numerico. se la classe è identificata da "prima", "seconda"..."quinta
' devi sostituire con una variabile di tipo stringa racchiusa tra apice singolo
SQL="select * from Scuola where Classe="&q
RS.Open SQL, conn, 3, 3
if not RS.EOF then
do until RS.EOF
idt=RS("id")
nome=RS("nome")
cognome=RS("cognome")
' implemento str
str=str&"<option value="""&idt&""">"&nome&" "&cognome&"</option>"
RS.movenext
loop
end if
RS.Close
conn.close
'fine select
str=str&"</select>"
response.write(str)
%>
ora devi caricare i dati della tabella scuola e provare
per quanto riguarda la grafica poi puoi fare quello che ti pare, io ho usato flexbox al posto di table per
definire i radio button
studiaci su e poi vedi se passi oltr il tuo intoppo...
Ciao
Permessi di invio
Rispondi quotando