Categories > TinyButStrong general (FR) >

Plusieurs <select> dépendants dans une meme page

The forum is closed. Please use Stack Overflow for submitting new questions. Use tags: tinybutstrong , opentbs
By: maischerchedonc
Date: 2009-12-09
Time: 09:10

Plusieurs <select> dépendants dans une meme page

Bonjour,

Je souhaite avoir 3 <select> pour filtrer des informations. Ces <select> (projet, sujet, activité) sont liés. La sélection d'un projet restreint la liste des sujets et des activités. La sélection d'un sujet sélectionne un projet et restreint la liste des activités, etc.
Mon problème est que si je sélectionne un projet, il sélectionne tout seul le premier sujet que je retrouve donc en $_POST. Evidemment le sujet ne correspond pas au projet choisi. J'ai pensé gérer une ligne vide dans chaque sélect (=absence de sélection) mais ce n'est pas très propre. Avez-vous une solution ? Ci-dessous le code du template.

Merci par avance


<td align="center">Projet : <select id="[var..cst._VN_SELECT_PROJECT_]" name="[var..cst._VN_SELECT_PROJECT_]" onChange="javascript:[var..cst._FN_GET_ACTIVITY_FILTER_POSTE_].submit()">
                <option value="[project.PROJECT_Code]" selected="selected";>[project.PROJECT_Code;block=option;when [var.project_code] = [project.PROJECT_Code]]</option></select></td>
                <option value="[project.PROJECT_Code]" >[project.PROJECT_Code;block=option;default]</option>
                <option value="x">[onshow.project_code;ope=html;select]</option>
            </select></td>
            <td align="center">Sujet : <select id="[var..cst._VN_SELECT_SUBJECT_]" name="[var..cst._VN_SELECT_SUBJECT_]" onChange="javascript:[var..cst._FN_GET_ACTIVITY_FILTER_POSTE_].submit()">
                <option value="[subject.SUBJECT_Code]" selected="selected";>[subject.SUBJECT_Code;block=option;when [var.subject_code] = [subject.SUBJECT_Code]]</option></select></td>
                <option value="[subject.SUBJECT_Code]" >[subject.SUBJECT_Code;block=option;default]</option>
                <option value="x">[onshow.subject_code;ope=html;select]</option>
            </select></td>
            <td align="center">Sujet : <select id="[var..cst._VN_SELECT_ACTIVITY_]" name="[var..cst._VN_SELECT_ACTIVITY_]" onChange="javascript:[var..cst._FN_GET_ACTIVITY_FILTER_POSTE_].submit()">
                <option value="[subject.ACTIVITY_Code]" selected="selected";>[subject.ACTIVITY_Code;block=option;when [var.subject_code] = [subject.ACTIVITY_Code]]</option></select></td>
                <option value="[subject.ACTIVITY_Code]" >[subject.ACTIVITY_Code;block=option;default]</option>
                <option value="x">[onshow.activity_code;ope=html;select]</option>
            </select></td>
By: Skrol29
Date: 2009-12-09
Time: 10:52

Re: Plusieurs <select> dépendants dans une meme page

Salut,

Ton problème c'est que ton formulaire renvoie les sélections des trois listes, mais tu n'as pas l'information de quelle liste (projet, sujet, activité) a été changée. Or cette information a un impacte sur ton résultat de filtrage. Tu devrais passer cette info par la fonction javascript, et modifier les sélections par défaut des autres listes en conséquences.

À part ça, je vois un truc bizard dans ton bout de modèle. Tu utilises à la fois des sections conditionnelles pour afficher une option avec select ou une option sans select, et à la fois le paramètre "ope=html" du plug-in HTML. Ca ne fait pas de bug, mais ça fait double emploi. Le plus rapide c'est les sections conditionnelles. Tu peux supprimer la ligne d'option avec "ope=html", je pense que ça marchera aussi bien, en plus vite.
By: maischerchedonc
Date: 2009-12-09
Time: 12:00

Re: Plusieurs <select> dépendants dans une meme page

Merci pour ce retour rapide,

J'utilise la section conditionnelle pour positionner le "selected" en fonction de ce qu'y est reçu du serveur.

Le plug-in HTML est là pour permettre de sélectionner une option et transmettre le choix au serveur (le code indiqué est dans un formulaire d'où l'instruction javascript).

Je vais donc ajouter une information dans le formulaire pour savoir quel est le <select> utilisé.

C'est la première fois que j'utilise TBS alors je ne suis pas sûr d'avoir tout compris sur ta remarque concernant le double-emploi sauf si mon explication ci-dessus y répond.
By: Skrol29
Date: 2009-12-09
Time: 13:49

Re: Plusieurs <select> dépendants dans une meme page

Je confirme que ta section conditionnelle fait la même chose que le plug-in.

La section conditionnelle choisie la ligne avec ou sans selected="selected" en fonction de [var.project_code]. Encore faut-il que $project_code contienne la bonne valeur quand le bloc "project" est fusionné.

Le paramètre "ope=html;select" appel le plug-in HTML pour qu'il scann les lignes <option> afin d'y ajouter l'attribut selected="selected" sur les lignes dont la valeur est égale à [onshow.project_code], c'est à dire égale à  $project_code au moment du $TBS->Show().
By: maischerchedonc
Date: 2009-12-11
Time: 14:12

Re: Plusieurs <select> dépendants dans une meme page

Merci, ça marche très bien avec tes conseils.