Listes déroulantes liées et div de chargement

Question

Je suis un peu novice en matière de programmation mais j'essaie d'apprendre. Ce que je dois faire pour mon site est d'avoir 2 ou 3 menus déroulants liés de sorte que lorsque je sélectionne un élément dans le premier, le second se rafraîchit avec d'autres options. J'ai trouvé un moyen de le faire en utilisant Java mais je n'arrive pas à le faire avec le rafraîchissement. div partie. J'ai regardé prototypejs / updater mais c'est un peu au-dessus de mon head et je ne parviens pas à le relier au JavaScript que j'ai utilisé pour les menus déroulants...

Donc, si quelqu'un peut me dire comment relier deux, voire trois menus déroulants et, après avoir cliqué sur une option du dernier menu, faire un div à partir du rafraîchissement de la page avec un autre contenu, merci de m'aider :)

Answer 1

Je ne suis pas sûr à 100 % de ce que vous recherchez, mais je pense que cela devrait vous permettre de faire au moins une partie du chemin :

http://remysharp.com/2007/09/18/auto-populate-multiple-select-boxes/

Il s'agit d'un plugin jQuery permettant de relier des boîtes de sélection entre elles, en utilisant Ajax pour charger les données afin de remplir la boîte suivante de la chaîne en fonction de la valeur sélectionnée dans la précédente.

Il vous faudra alors encore relier la dernière case avec le bouton div - mais vous devriez être capable de le faire vous-même avec une méthode similaire - voir la documentation de jQuery Ajax.

http://docs.jquery.com/Ajax

Answer 2

Essayez une recherche sur google pour les boîtes de sélection dynamiques, il y a beaucoup d'exemples, choisissez le moins compliqué qui correspond le mieux à vos connaissances.

Le principe est de lier une fonction à l'événement "onchange" que la boîte de sélection déclenche lorsqu'un élément est sélectionné.

En supposant que cette boîte de sélection :

<select id="select1" name="option">
</select>

le fragment de javascript est :

var sel1 = document.getElementById("select1");
sel1.onchange = function() {
  //do whatever you want
};

Pour la première et la deuxième sélection, la fonction chargera les options des autres sélections, tandis que dans le troisième cas, elle affichera votre div.