Forum de discussion
Forum « Programmation ASP » (archives)
Re: Choix multiple dynamique.
Envoyé: 19 janvier 2005, 10h07 par Oznog
Si je comprend bien, tu as différents second-choix selon le premier choix. Et probablement différents troisième choix selon cette fois le deuxième choix. C'est bien ça?
Comme tu dis, pour ce faire en ASP tu dois recharger une page (pas n'écessairement une nouvelle) pour ajuster les séries de choix.
Mais si tu le fais en Javascript, tu n'aura pas besoin de recherger la page à chaque fois. Plus rapide, plus sécuritaire et sans ressources serveur si ce n'est de la construction du script Javascript. Tu sauve alors autant de ressources serveur que de clic dans le formulaire multiplié par le nombre d'usager. Si par exemple le retour d'une nouvelle page demande une connexion à la base de données à chaque fois, imagine le nombre de ressources que tu libère sur le serveur.
Il y a plusieurs façon de faire. Tu peux avoir un espace (ta colonne) que tu modifie en temps réel avec les bons sous-choix.
Mais l'idéale est d'avoir autant d'espace INVISIBLE que de listes de choix. Tu rend VISIBLE seulement la bonne liste de sous-choix selon le premier choix. De cette façon, si l'usager fait un clic par mégarde, les information ne seront pas perdu.
C'est donc une bonne question pour le forum Javascript. Un point de départ. Ton ASP devra générer (selon tes choix et sous-choix) quelque chose comme :
<form...>...
' Ici la première colonne probablement statique des premiers choix.
<td><input type="radio"... onclick="monJavascriptQui AjusteLesAutreColonneJeLuiPasseLObjetFormulaireAuComplet(this.form')...<input type="radio"...<input type="radio"...
</td>
' Deuxième colonne
<td>
<div id="monPremierSous-Choix" style="position:absolute;visibility:hidden;"><input...</div>
<div id="monDeuxiemeSous-Choix"><input...</div>
<div id="monTroisiemeSous-Choix"><input...</div>
</td>
' Troisième colonne
<td>
<div id="monPremierSous-Sous-Choix" style="position:absolute;visibility:hidden;"><input...</div>
<div id="monDeuxieme-SousSous-Choix"><input...</div>
<div id="monTroisieme-SousSous-Choix"><input...</div>
</td>
...
</form>
etc.
Bon, DIVs devront bien sûr être invisible (hidden) "position:absolute;visibility:hidden;" et tu peux afficher celui que tu veux avec une fonction comme "twAfficheCache" :
<!--
Un calque #1 visible.
Et un #2 invisible.
Mais aussitôt affiché
twAfficheCache affiche le #2
et rend invisible le #1...
-->
<script type="text/javascript" language="javascript">
// Script des Trucsweb
var ns4=document.layers
var ie4=document.all
var ns6=document.getElementById&&!document.all
function twAfficheCache(nObjet,nEtat) {
if(ie4) { // Internet explorer
eval(nObjet).style.visibility = (nEtat==0?'hidden':'visible');
}
else if(ns4) { // Netscape 4.x
document.eval(nObjet).visibility = (nEtat==0?'hidden':'show');
}
else if(ns6) { // Netscape 6 (mozilla)
document.getElementById(nObjet).style.visibility = (nEtat==0?'hidden':'visible');
}
}
</script>
<div id="monChoix1">Mes choix 1</div>
<div id="monChoix2" style="position:absolute;visibility:hidden;">Mes choix 2</div>
<script type="text/javascript" language="javascript">
twAfficheCache('monChoix1',0);
twAfficheCache('monChoix2',1);
</script>
Pour plus de détail, voir la section DHTML de ce site ou le forum Javascript.
Ciao
Oznog
Réponses
|