En utilisant DATATABLE Primefaces

Question

J'utilise l'objet dataTable de primefaces pour afficher des données et j'ai quelques problèmes pour réaliser quelque chose: J'affiche d'abord une table avec seulement 1 colonne et je veux afficher une autre table remplie de données en fonction de ce que l'utilisateur a sélectionné sur la première.

Pour cela, lorsque l'utilisateur sélectionne une ligne dans la première table, je remplir le dossier de currentCorbeilleId de mon TaskController et essayer de mettre à jour le formulaire « TasksList ». Il est logique quand j'écris que maintenant, mais cela ne fonctionne pas ... Lorsque je clique sur une ligne de la première table, rien ne se passe ...

Suis-je utiliser le composant dataTable la bonne façon? Que dois-je faire de plus pour rendre cela fonctionne? Merci pour vos réponses!

<f:view>
        <h:form id="mainForm">
            <p:dataTable id="corbeillesList"
                         value="#{IdentityController.groups}"
                         var="corbeillesList"
                         rendered="#{not empty IdentityController.groups}"
                         selectionMode="single"
                         selection="#{TaskController.currentCorbeilleId}"
                         update="tasksList">
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Name" />
                    </f:facet>
                    <h:commandLink value="#{corbeillesList.name}">
                    </h:commandLink>
                </p:column>
            </p:dataTable>
            <p:dataTable id="tasksList"
                         value="#{TaskController.tasks}"
                         var="task"
                         rendered="#{not empty TaskController.tasks}"
                         selectionMode="single">
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Date" />
                    </f:facet>
                    <h:outputText value="#{task.duedate}" rendered="#{task.duedate != null}">
                        <f:convertDateTime pattern="dd/MM/yyyy" type="date" dateStyle="short" />
                    </h:outputText>
                    <h:outputText value="Date non definit" rendered="#{task.duedate == null}" />
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Name" />
                    </f:facet>
                    <h:outputText value="#{task.name}" />
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Description" />
                    </f:facet>
                    <h:outputText value="#{task.description}" />
                </p:column>
                <p:column>
                    <f:facet name="header">
                        <h:outputText value="Verouillee" />
                    </f:facet>
                    <h:outputText value="oui" rendered="#{task.assignee != null}" />
                    <h:outputText value="non" rendered="#{task.assignee == null}" />
                </p:column>
            </p:dataTable>
        </h:form>
    </f:view>

Answer 1

La deuxième table de données n'a pas été rendu au côté client. Il est donc pas accessible pour les ajax update. Mettez-le dans par exemple un h:panelGroup au lieu qui est toujours rendu au côté client.

<h:panelGroup id="tasksList">
    <h:dataTable rendered="#{not empty TaskController.tasks}" ... >
        ...
    </h:dataTable>
</h:panelGroup>