обновление PrimeFaces datatable с использованием ajax

Question

am Использование примитивов. Возникает проблема с обновлением datatable. У меня есть командная кнопка, и когда я отправил свою командную кнопку, я хочу обновить свой datatable.

код дает ниже:

<h:form id="mainform"> 
     <p:outputPanel id="my" autoUpdate="true"> 
      <p:dataTable var="test" value="#{examinationFormBean.examinationList}" 
      paginator="false" rows="10" id="datatable" widgetVar="examinationdata" 
      filteredValue="#{examinationFormBean.getFilterExaminationList}"> 


      <f:facet name="header"> 

       <p:outputPanel> 
        <h:outputText value="Search all fields:" /> 
        <p:inputText id="globalFilter" onkeyup="PF('examinationdata').filter()" 
        style="width:150px" /> 
       </p:outputPanel> 

      </f:facet> 



      <p:column headerText="Id" filterBy="#{test.formStatus.id}"> 
       <h:outputText value="#{test.formStatus.id}" /> 
      </p:column> 

      <p:column headerText="Name Of Candidate" filterBy="#{test.formStatus.user.name}"> 
       <h:outputText value="#{test.formStatus.user.name}" /> 
      </p:column> 

      <p:column headerText="Examination" filterBy="#{test.examination.name}"> 
       <h:outputText value="#{test.examination.name}" /> 
      </p:column> 


      <p:column headerText="View/Action"> 
        <p:commandLink value="View" action="#{examinationFormBean.readFormStatus(test.formStatus.id)}" 
        oncomplete="PF('test').show()" update="@(.ui-panel)"> 
        </p:commandLink> 
      </p:column> 

     </p:dataTable> 
     </p:outputPanel> 
     </h:form> 


and my diloag box is : 

     <p:dialog widgetVar="test" modal="true" id="dialog" height="600" width="760" dynamic="true" draggable="false" closable="true"> 

       <h:form id="data"> 
        <div class="row" > 

         <p:growl id="growl" sticky="true" showDetail="true" /> 

         <p:panel header="Examination Details"> 

         <h:panelGrid columns="2" cellpadding="4" border="1" id="panael1" style="text-align: left;color: #333399;" width="760"> 

           <h:outputText value="#{msg['elicense.examinationform.personal.proposeofexam']}"/> 
           <h:outputText id="propExam" value="#{examinationFormBean.examination.name}"/> 

           <h:outputText value="#{msg['elicense.examinationform.personal.classofcertificates']}" /> 


           <ui:fragment rendered="#{examinationFormBean.elementaryPrinciples==true}"> 
            <h:outputText id="grid" value="Elemetry Principle"/> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.wiringForSystem==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data1" value="Wiring for System not Exceeding 250 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.dcApparatus==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data2" value="D. C. Apparatus not Exceeding 650 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.acApparatus==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data31" value="A. C. Apparatus not Exceeding 650 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.acApparatus==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data3" value="A. C. Apparatus not Exceeding 650 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.undergroundCable1100Volts==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data4" value="Underground Cables Voltage upto 1100 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.undergroundCable11900Volts==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data5" value="Underground Cables Voltage upto 11900 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.undergroundCable3300Volts==true}"> 
            <p:spacer></p:spacer> 
           <h:outputText id="data6" value="Underground Cables Voltage exceeding 33000 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.installationExceding650Volts==true}"> 
           <p:spacer></p:spacer> 
           <h:outputText id="data7" value="Installation exceeding 650 Votts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.overHeadLiesupto650Volts==true}"> 
           <p:spacer></p:spacer> 
           <h:outputText id="data8" value="Overhead lies Upto 650 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.overHeadLiesupto3300Volts==true}"> 
           <p:spacer></p:spacer> 
           <h:outputText id="data9" value="Overhead lies Upto 33000 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.overHeadLiesExceeding3300Volts==true}"> 
           <p:spacer></p:spacer> 
           <h:outputText id="data10" value="Overhead lies Exceeding 33000 Volts" ></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.minigInstallation==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data11" value="Mining Installation(Bellow Ground)"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.minigInstallation==true}"> 
           <p:spacer></p:spacer> 
           <h:outputText id="data12" value="Mining Installation(Bellow Ground)"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.minigInstallation==true}"> 
           <p:spacer></p:spacer> 
           <h:outputText id="data121" value="Mining Installation(Bellow Ground)" ></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.wiringForSystemUpto650Volts==true}"> 
           <p:spacer></p:spacer> 
           <h:outputText id="data13" value="Wiring for System not exceeding 650 Volts"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.electricIt==true}"> 
           <p:spacer></p:spacer> 
            <h:outputText id="data14" value="Electric Lt"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.electricIt==true}"> 
           <p:spacer></p:spacer> 
            <h:outputText id="data141" value="Electric Lt"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.electricSigns==true}"> 
           <p:spacer></p:spacer> 
           <h:outputText id="data15" value="Electrict Signs"></h:outputText> 
           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.mediumPressure==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data16" value="Medium Pressure Indian Electricity Rules 1959" /> 

           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.mediumPressure==true}"> 
            <p:spacer></p:spacer> 
            <h:outputText id="data161" value="Medium Pressure Indian Electricity Rules 1959" /> 

           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.ltOverHeadLines==true}"> 
            <p:spacer></p:spacer> 
           <h:outputText id="data18" value="Overhead Lines(LT)" /> 

           </ui:fragment> 

           <ui:fragment rendered="#{examinationFormBean.paperInsulatedCables==true}"> 
            <p:spacer></p:spacer> 
           <h:outputText id="data19" value="Pepar Insulated cables(laying and joining)" /> 

           </ui:fragment> 




           <h:outputText value="#{msg['elicense.examinationform.examination.centerofexamination']}" /> 
           <h:outputText id="examcenterid" value="#{examinationFormBean.center.name}" /> 

           <h:outputText value="#{msg['elicense.examinationform.examination.languagepaper']}" /> 
           <h:outputText id="language" value="#{examinationFormBean.language.name}" /> 

          </h:panelGrid> 
         </p:panel> 



         <!-- personal details --> 

          <ui:include src="/pages/personalView.xhtml" /> 



         <!-- Education Qualification --> 

         <p:panel header="Education Qualification"> 

          <ui:include src="/pages/educationalQualificationsView.xhtml" /> 


         </p:panel> 


         <!-- Certificate or Permit Details --> 


         <p:panel header="Previous Certificate Details"> 
          <h:panelGrid columns="2" style="text-align: left;color: #333399;" width="760"> 

           <h:outputText value="#{msg['elicense.examinationform.academic.premitno']}" /> 
           <h:outputText id="permitid" value="#{examinationFormBean.previousCertificate.previousPermitNo}" /> 

           <h:outputText value="#{msg['elicense.examinationform.academic.certificate']}" /> 
           <h:outputText id="certificateid" value="#{examinationFormBean.previousCertificateNo}" /> 

           <h:outputText value="#{msg['elicense.examinationform.academic.otherstatepermitno']}" /> 
           <h:outputText id="otherstatepermitid" value="#{examinationFormBean.otherStatePermitNo}" /> 

           <h:outputText value="#{msg['elicense.examinationform.academic.otherstatecertificateno']}" /> 
           <h:outputText id="otherstatecertificateid" value="#{examinationFormBean.otherStateCertificateNo}" /> 

           <!-- <h:outputText 
            value="#{msg['elicense.examinationform.academic.dateofissue']}" /> 
           <h:outputText id="compopupforprivious" 
            value="#{examinationFormBean.previousRegistrationDate}" /> 
    --> 
          </h:panelGrid> 
         </p:panel> 


         <!-- Experience Details --> 

         <p:panel header="Experience Details"> 
          <ui:include src="/pages/experienceView.xhtml" /> 
         </p:panel> 



         <!-- Treasury Challan Details --> 

         <ui:include src="/pages/treasuryChallanView.xhtml" /> 


         <!-- Attachment --> 

         <p:panel header="Upload necessary Document"> 

          <h:panelGrid columns="2" style="text-align: left;color: #333399;" width="760" border="1"> 

           <h:outputText value="#{msg['elicense.examinationform.uplod.document']}" /> 

           <p:graphicImage value="#{examinationFormBean.candidatePhoto}" /> 

           <h:outputText value="#{msg['elicense.examinationform.uplod.sign']}" /> 
           <p:graphicImage value="#{examinationFormBean.signature}" mode="simple" disabled="false" 
           label="Candidates Signature " /> 
           <p:spacer></p:spacer> 
           <p:messages id="messageid"/> 

           <h:outputText value="Action :" class="alignment"/> 

           <p:selectOneRadio id="console" value="#{examinationFormBean.action}" 
            required="true" label="Action"> 
            <f:selectItem itemLabel="Ok" itemValue="ok" /> 
            <f:selectItem itemLabel="Have Issued" itemValue="haveissue" /> 
            <p:ajax process="console" update="@form" /> 
           </p:selectOneRadio> 

           <h:outputLabel value="Comment:" rendered="#{examinationFormBean.action eq 'haveissue'}"></h:outputLabel> 

           <h:inputText id="compid" value="#{examinationFormBean.comment}" rendered="#{examinationFormBean.action eq 'haveissue'}"/> 
           <p:watermark for="compid" value="Enter Valid Reason"></p:watermark> 

           <p:commandButton value="Forwarded to Zonal Electrical Inspector>>" 
            actionListener="#{examinationFormBean.saveFormStatusByOfficeAssistent()}" update=**"messageid,my"** process="data" oncomplete="if (args &amp;&amp; !args.validationFailed) PF('test').hide()" > 


           </p:commandButton> 

          </h:panelGrid> 

         </p:panel> 

        </div> 
      </h:form> 

     </p:dialog> 

Я хочу обновить мой DataTable, и я использую outputpannel идентификатор в моем обновлении кнопки команды, снова IA использовал мой DataTable идентификатора, но primefaces не мог найти его.

Answer 1

Ссылка на компоненты в сложной компоновке с несколькими контейнерами имен может быть проблемой, но самым простым решением в этих ситуациях является таргетинг компонента по стилю.

<p:dataTable ... styleClass="myDataTable" ... > 

<p:commandButton ... update="@(.myDataTable)" ... > 

Другого Достоинство такого подхода является то, что он невосприимчив к изменениям макета (в противном случае вам придется обновить идентификаторы компонентов, которые вы хотите обновить каждый раз, когда вы добавить/удалить другой контейнер именования в соответствующем положении).

UPDATE (с комментариями)

Оставить saveFormStatusByOfficeAssistent() подпись, как это было (возвращение пустоты), как раз в конце метода добавьте строку examinationList=examinationDetailsService.readExaminationList();

public void saveFormStatusByOfficeAssistent() { 
    System.out.println("hiiii"+this.getComment()); 
    formStatus.setStatus(getAction()); 
    formStatus.setComment(this.getComment()); 
    examinationDetailsService.saveFormStatus(formStatus); 
    System.out.println("Hi page successfully save"+getAction()); 
    this.setAction(""); this.setComment(null); 
    examinationList=examinationDetailsService.readExaminationList(); 
} 

И getUserList() должны просто вернуть examinationList

public List<ExaminationDetails> getUserList() { 
    return examinationList; 
} 

Answer 2

Проблема в том, что вы неправильно ссылаетесь на компоненты. Вам нужно добавить идентификатор формы. т.е. update=":mainForm:my , :data:messageid"

Answer 3

Ну, вызов обновления на компоненте, который расположен в другом NamingContainer, необходимо разрешение абсолютного идентификатора/пути

Вы можете попробовать что-то вроде них на ваш р: CommandButton компонент

update=":#{p:component('datatable')}" 
update="PF('examinationdata')}" 
update=":mainform" 

Или вы можете проверить свой html-код и найти абсолютный id datatable. Дополнительная информация here