Discussion :

[swissmade]

bonjour,

J'ai un menu déroulan et je voudrai que selon le choix que l'utilisateur fait que certain nouveau champs apparaissent sur mon formulaire.

Ex:
si l'utilisateur choisi "foot" les champs "couleur de ballon et taille des chaussure" apparaisse et s'il choisi "hockey" les champs "longueur de la canne, température de la glace et nombre de fracture" apparaisse (exemple fictif)

Auriez vous un tuto ou un bout de code que je pourrai utiliser (je métrise mal ajax)

D'avance merci

[Borowsky]

Les tutos AJAX de developpez.com sont pas mal. Je n'y connaissais rien et c'est avec ça que j'ai commencé..

[swissmade]

Les tutos AJAX de developpez.com sont pas mal. Je n'y connaissais rien et c'est avec ça que j'ai commencé..

ok merci mais y en a t'il un qui traite spécifiquement mon problème?

[DoubleU]

Spécifiquement forcément non, les tutos étant la plutot pour t'expliquer le principe d'Ajax. Si tu comprends ce principe, tu es capable d'adapter la techno a tous tes besoins.

[gui80]

Bonjour,

ton problème n'a pas de rapport avec AJAX.
Résumé : AJAX (actualiser une partie d'une page via interaction avec du php ou xml.
Avantage : moindre sollicitation serveur, plus de temps d'interactivité entre l'utilisateur et le site car pas besoin de rafraîchir la page entière et donc d'attendre quelque secondes).

Toi, ce que tu veux faire, c'est t'amuser à cacher/décacher des champs selon une liste déroulante.

Donc, le truc, c'est que tous les champs seront chargés (couleur ballon, longueur de canne, ...), tu caches tous les champs dépendants du sport choisi.
Quand il choisit un sport, tu décaches les champs en rapport avec ce sport.

Donc, une liste déroulante contenant les sports. Quand il en choisit un, appel d'une fonction javascript. Dedans, tu décaches les champs en rapport avec ce sport.

Pour décacher un élément :
document.getElementById(id).style.visibility="visible";
document.getElementById(id).style.display="block";

Pour cacher un élément :
document.getElementById(id).style.visibility="hidden";
document.getElementById(id).style.display="none";

Dis moi comment tu avances. Tu as les clés en main à présent.

[DoubleU]

Ouais fin, s'il a 50 sports, il va pas faire 50 divs a cacher hein ^^

C'est plus simple d'aller chercher dans la base les éléments qui correspondent et les ajouter/supprimer dynamiquement...

[gui80]

C'est vrai.
Si il a beaucoup de sports, l'ajax sera plus efficace.

Création d'éléments HTML donc.
Tu proposerai quoi pour celà ?
Connais-tu des frameworks qui permettent de créer dans le DOM facilement des éléments HTML ? possible avec prototype.js ?

Merci de tes éclaircissements, ça m'intéresse.

[DoubleU]

Création des éléments via le DOM oui.

Niveau frameworks, oui prototype te permet ca, mais t'auras aussi vite faite de le faire à la main.

[gui80]

Merci, je vais me repencher sur ce domaine DOM.

J'utilise pas mal prototype.js, j'ai souvenir d'avoir gérer des éléments dynamiquement, mais j'avais dû faire des choses manuellement l'an dernier il me semble.

On en reparle dans ce POST tout en aidant swissmade.

[Carabi]

Bonjour à vous,

Je me permet de mettre mon grain de sel dans ce post. J'utilise actuellement JQuery, qui me satisfait grandement, et qui, pour ma part, est très simple d'utilisation. Je génère des tables en HTML via des fonctions JS après retour AJAX, et cela fonctionne parfaitement. Je confirme donc que pour le cas de swissmade, il sera intéressant d'utiliser cette technique, surtout pour des listes déroulantes conséquentes.

Voilà, bon courage à vous !