0

I used DataTable - Row Selection from prime faces to display list of users and when I run the page I faced this error

Cannot find component with expression ":dialog1:employes" referenced from "dialog1:j_idt43:j_idt51"

<h:form id="dialog1">
                <p:accordionPanel>
                    <p:tab title="nouveau Groupe">

                        <h:panelGrid columns="2">
                            <h:outputLabel value="nom groupe" />
                            <p:inputText value="#{CalCulJobsBean.libelle}" />
                        </h:panelGrid>
                        <p:commandButton value="submit"
                            action="#{CalCulJobsBean.ajouter()}" icon="ui-icon-check"
                            style="margin-left: 40%"
                            oncomplete="PF('DialogAddGroupesalriers').hide()" />
                    </p:tab>

                    <p:tab title="liste Salariers">

                                    <h:outputLabel value="Matricule:" />
                                    <p:inputText value="#{donneesIndividuellesBean.matricule}"
                                        onkeypress="if (event.keyCode == 13) {onchange(); return false; }">
                                        <p:ajax event="change"
                                            listener="#{donneesIndividuellesBean.chercherEmployesByMatricule()}"
                                            update=":dialog1:employes" /> 
                                    </p:inputText>
                                <!--    <p:commandButton icon="ui-icon-plus fa fa-plus"
                                        onclick="PF('dialog1').show()" update=":formdialog1">
                                    </p:commandButton> -->

                        <p:commandButton icon="ui-icon-plus fa fa-plus"
                            onclick="PF('dialog2').show()" update=":formdialog1">
                        </p:commandButton>



                            <p:panel header="liste des salariers">

                                <h2>select + to add</h2>
                                <p:dataTable id="employes"
                                value="#{donneesIndividuellesBean.employesCherches}" var="emp"
                                selection="#{donneesIndividuellesBean.identiteSelectionne}"
                                rowKey="#{emp.numedoss}" selectionMode="single">
                                <f:facet name="header">

                                </f:facet>
                            <!--    <p:ajax event="rowSelect"
                                     execute="@this"
                                    update=":employe" /> -->


                                <p:column style="width:40px">
                                    <p:graphicImage value="#{donneesIndividuellesBean.photoE}" cache="false"
                                        id="dragImg" style="width:30px; height:40px;">
                                        <f:param name="empid" value="#{emp.numedoss}" />
                                        <p:draggable for="dragImg" revert="true" helper="clone" />
                                    </p:graphicImage>
                                </p:column>
                                <p:column headerText="Matricule">
                                    <h:outputText value="#{emp.matricul}" />
                                </p:column>
                                <p:column headerText="Nom">
                                    <h:outputText value="#{emp.nom}" />
                                </p:column>
                                <p:column headerText="Prenom">
                                    <h:outputText value="#{emp.prenom}" />
                                </p:column>


                            </p:dataTable>


                </p:accordionPanel>

            </h:form>
        </p:dialog>

What is the problem with my code ?

Kevin Panko
  • 8,356
  • 19
  • 50
  • 61
RayGR
  • 1
  • 1
  • 1
  • 3

2 Answers2

2

In generally, JSF will generate component id whenever developers do not specific component id by automatically. Thus, you should specific id of the <p:accordionPanel> to skip generate by automatically.

In the case of, <p:accordionPanel id="ac"> has an id="ac", you can refer by update=":dialog1:ac:employes"

wittakarn
  • 3,124
  • 1
  • 18
  • 31
  • Though the solution to the problem is right your answer lacks explanatory power that I tried to compensate in my answer. Still, you get my upvote (as well for being active within the JSF-tagged questions). – skuntsel Nov 13 '14 at 07:30
  • @RayGR You are welcome, but you should mark green chech on the right solution. – wittakarn Nov 15 '14 at 00:37
1

Some of the components within JSF/PrimeFaces implement the NamingContainer inerface. Such components affect the way client ids of its children are generated. The examples of such components include <h:form> (HtmlForm class) and <p:accordionPanel> (AccordionPanel class). While you seem to be aware of the former, you did not know that the latter was a naming container as well.

When you want to AJAX-update a given component you need to specify either its id, in case it's located relative to the same naming container, or its client id, in case it's relative to the view root. Tying it to your view structure we get update=":formId:accordionPanelId:dataTableId".

The last issue to concern is that every component must have an id set so that it could be found within a component tree and surely be unique. In case you supply an id of your own, like in id="myComponentId", you will set the id for the component. Otherwise component id will be autogenerated by the JSF framework for you: that's why you ind those j_idt43 ids.

To sum it up, you need to explicitly specify id for your accordion panel and include it in your path to the to-be-updated component (exactly as proposed in wittakarn's answer).

Community
  • 1
  • 1
skuntsel
  • 11,624
  • 11
  • 44
  • 67