Search code examples
jsfprimefacesjava-ee-6

Access and refresh dataTable after getting data

I have got some problems with my JSF page, and (probably) with backing bean. I have got own template and I fill the content area with some pages. I have got search page with commandbutton and I would like to get data from database (JPA) and than fill the datatable. Look at my searchpeople.xhtml:

<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="template.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core">

    <ui:define name="content">
        <h:form id="sampleform">  
            <p:accordionPanel activeIndex="-1" id="accordingpanle">  
                <p:tab title="User options" >   
                    <p:growl id="growl" showDetail="true" showSummary="true"/> 
                    <p:commandButton id="searchbutton" action="#{mb_person.search}" value="Szukaj" update="personsearchresulttable" />
                </p:tab>
            </p:accordionPanel>

            <p:dataTable id="personsearchresulttable" var="person" value="#{mb_person.people}" widgetVar="personTable" style="margin-top: 10px" >  
                <p:column headerText="Id" style="width:10%">
                    <h:outputText value="#{person.id}" />  
                </p:column>
                <p:column headerText="Name" style="width:20%">  
                    <h:outputText value="#{person.name}" />  
                </p:column>  
                <p:column headerText="Surname" style="width:20%">  
                    <h:outputText value="#{person.surname}" />  
                </p:column>  
                <p:column headerText="Company">  
                    <h:outputText value="#{person.companyName}" />  
                </p:column> 
                <p:column style="width:4%" headerText="Open">  
                    <h:link outcome="persondetails" value="Open">
                        <!--<f:param name="personid" value="#{person.id}"/>-->
                        <f:param name="personid" value="10076"/>
                    </h:link>
                </p:column>  
            </p:dataTable>  
        </h:form>  
    </ui:define>
</ui:composition>

And my backingbean with EJB injection.

@ManagedBean(name="mb_person")
public class MB_Person implements Serializable{

    @EJB
    private PersonFacade personFacade;
    private List<PersonAndCompany> people = new ArrayList<PersonAndCompany>();

    public MB_Person() {
    }

    public List<PersonAndCompany> getPeople() {
        return people;
    }

    public void setPeople(List<PersonAndCompany> people) {
        this.people = people;
    }

    public void search() {
        int[] range = {0,5};
        setPeople(personFacade.findPersonWithMoreThanXProjects(20));
        setPeople(personFacade.findPersonAndCompanyName(range));

        for(PersonAndCompany p:people){
            System.out.println(p.getName());
        }
    }
    public String goToPersonDatailPage(int id){
        return "persondetails.jsf?personid="+id;
    }
}

I tried small test and printout all data in method search and I received good results. Someone can help me how to update dataTable using ajax? In this form I have got an exception Cannot find component with identifier "personsearchresulttable" referenced from "sampleform:accordingpanle:searchbutton".

Solution

  • Relative client IDs are searched relative to parent NamingContainer component. The <p:accordionPanel> is by itself a NamingContainer. So the relative client ID personsearchresulttable would be searched inside the context of the <p:accordionPanel>. However, it's actually outside the panel, inside the <h:form>.

    You need to change the relative client ID to be an absolute client ID.

    update=":sampleform:personsearchresulttable"

    See also: