Discussion :

[heteroclite]

Bonjour,

Je voudrais mettre en place un formulaire dynamique sur mon site.
Je m'explique:
Je voudrais par exemple avoir un premier menu deroulant avec les régions françaises.

Une fois la region selectionnée, je voudrais que le deuxième menu ne propose que les departements de cette région...puis les villes de ce dep...etc

Je voudrais donc comprendre le principe de ce fonctionnement? Si quelqu'un avait un exemple de code ...je serais tout à fait preneur .

Merci d'avance !

[SOAD08]

Tu as plusieurs solutions pour faire ça :

-Soit tu stocke tous tes departements dans des tableaux regions et toute les données seront présente dans ta page, tu n'auras qu'a afficher

-Sinon tu utilise Ajax et plus particulierement XMLHttpRequest, et lors du choix d'une region, tu recupere les departement dans une page php.

[pioule]

Ou encore en javascript, avec une fonction utilisant le innerHTML pour modifier dynamiquement le contenu de tes listes... il faut juste prégénérer tes tableaux avant

Mais l'une ou l'autre de chaque méthode implique que tu aies dans une base de données l'ensemble des régions, puis des départements, des villes, etc...

Un exemple que l'on a réalisé au boulot : générer une liste de communes à partir d'une liste de code postaux :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 
<SCRIPT LANGUAGE="JavaScript">
var tabcp = new Array();
 
tabcp['62000'] = ["DAINVILLE","ARRAS"] ;
tabcp['62100'] = ["CALAIS"] ;
tabcp['62110'] = ["HENIN BEAUMONT"] ;
.
.
.
tabcp['62960'] = ["BOMY","BEAUMETZ LES AIRE","LAIRES","FLECHIN","FEBVIN PALFART","WESTREHEM","ERNY SAINT JULIEN","LIGNY LES AIRE"] ;
tabcp['62970'] = ["COURCELLES LES LENS"] ;
tabcp['62980'] = ["VERMELLES","NOYELLES LES VERMELLES"] ;
tabcp['62990'] = ["LEBIEZ","ROYON","MARENLA","LESPINOY","HESMOND","MARESQUEL ECQUEMICOURT","CONTES","RIMBOVAL","EMBRY","SAINT DENOEUX","BOUBERS LES HESMOND","LOISON SUR CREQUOISE","OFFIN","BEAURAINVILLE"] ;
 
function affichercommune(cp)
{
   if (cp)
   {
       html = 'Commune : <select name=\"commune\" size=\"1\">';
       html += '<OPTION VALUE="0">Faites votre choix</OPTION>';
       var localites = tabcp[cp];
       for (i in localites)
       {
           html += '<option value=\"' + localites[i] + '\"> ' +  localites[i] + '</option>';
       }
       html += '</select>';
       document.getElementById('blocLocalites').innerHTML = html;
   }
}
</SCRIPT>

Et l'appel :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<SELECT NAME="cp" SIZE="1" onchange="affichercommune(this.value)">
</SELECT>
.
<span id="blocLocalites"></span>

Mais la solution Ajax sera je pense beaucoup plus facile à mettre en oeuvre, je n'ose pas imaginer la prégénération de tes tableaux pour alimenter du javascript ...

[heteroclite]

merci beaucoup pour vos réponses .
Le problème c'est que je ne connais pas du tout le javascript....il n'y aurait pas une solution php/mysql pour faire ça ?
merci beaucoup !

[vg33]

Si, mais tu auras un chargement complet de la page à chaque sélection d'un item de l'une des listes. Ca ne sera pas du plus bel effet... sans compter le clignotement et le petit 'ding' d'IE
Je souscris complètement au conseil précédent : utilise AXAX.
Tu trouveras dans la section Développement Web de developpez.com tous les tutoriels et les conseils nécessaires. Je te laisse le plaisir de trouver le tutoriel qui explique justement le principe de listes liées utilisant AJAX