Primefaces datatable update datatable

Question

primefaces 데이터 테이블에 문제가 있습니다. 일부 항목과 열이있는 datatable을 내부에 단추가 있습니다. 버튼을 누르면 다른 데이터 테이블로 팝업이 열립니다. 두 번째 데이터 테이블의 항목은 단추를 누른 행에 따라 다릅니다. DB를 쿼리 한 후 목록에서 몇 가지가 있지만

<!-- first datatable --> 
<h:form id="list"> 
<p:dataTable id="list1" var="item" value="#{bean1.itemlist}" 
    rowKey="#{item.id}" selection="#{bean1.selectedItem}" 
    selectionMode="single"> 

    <p:column headerText="ID"> 
     <h:outputText value="#{item.id}" /> 
    </p:column> 
    ... 
    <p:column headerText="Edit Entries"> 
     <p:commandButton value="Edit Entries" 
      actionListener="#{bean2.updateEntries(item)}" ajax="true" 
      oncomplete="PF('edit_entries').show()" /> 

     </p:column> 
</p:dataTable> 

<!-- Second datatable in the popup --> 
<p:dialog header="Edit Entries" widgetVar="edit_entries" modal="true" 
    resizable="false"> 
     <p:dataTable id="list2" var="entry" 
      value="#{bean2.entriesList}" rowKey="#{entry.id}" 
      selection="#{bean2.selectedEntry}" selectionMode="single"> 
      <p:column headerText="Entry Number"> 
       <h:outputText value="#{entry.number}" /> 
      </p:column> 
     </p:dataTable> 
     <f:facet name="footer"> 
      <p:commandButton value="Save" oncomplete="PF('edit_entries').hide()" /> 
     </f:facet> 
</p:dialog> 
</form> 

Bean2

public void updateEntries(Item selectedItem) { 
    this.entriesList = this.entriesQuery.getAllEntriesByItemID(selectedItem.getId());//db query could take some time 
    System.out.println("entrieslist size: " + this.entriesList.size()); //prints the correct size 
} 

문제는 팝업 데이터 테이블에 나열된 항목이 없다는 것입니다.

이 버그를 해결하는 방법에 대한 아이디어가 있으십니까? 미리 감사드립니다.

UPDATE 1 :은

<!-- first datatable --> 
<h:form id="list"> 
<p:dataTable id="list1" var="item" value="#{bean1.itemlist}" 
    rowKey="#{item.id}" selection="#{bean1.selectedItem}" 
    selectionMode="single"> 

    <p:column headerText="ID"> 
     <h:outputText value="#{item.id}" /> 
    </p:column> 
    ... 
    <p:column headerText="Edit Entries"> 
     <p:commandButton value="Edit Entries" update=":dialogUpdateEntries" 
      actionListener="#{bean2.updateEntries(item)}" ajax="true" 
      oncomplete="PF('edit_entries').show()" /> 

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

<!-- Second datatable in the popup --> 
<p:dialog header="Edit Enries" id="dialogUpdateEntries" widgetVar="edit_entries" modal="true" 
    resizable="false"> 
    <h:form id="formEntriesList"> 
     <p:dataTable id="list2" var="entry" 
      value="#{bean2.entriesList}" rowKey="#{entry.id}" 
      selection="#{bean2.selectedEntry}" selectionMode="single"> 
      <p:column headerText="Entry Number"> 
       <h:outputText value="#{entry.number}" /> 
      </p:column> 
     </p:dataTable> 
     <f:facet name="footer"> 
      <p:commandButton value="Save" oncomplete="PF('edit_entries').hide()" /> 
     </f:facet> 
    </form> 
</p:dialog> 

Answer 1

실제로 대화 상자에서 데이터 테이블을 업데이트하지 않습니다. JSF는 모델 변경시보기를 자동으로 업데이트하지 않으므로보기를 명시 적으로 수행해야합니다. 이를 위해 ajax 액션 구성 요소의 update 속성을 사용할 수 있습니다. 여기에는 관련 답변에 설명 된대로 규칙에 따라 찾을 수있는 JSF 클라이언트 ID가 사용됩니다 (How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar"). 질문과 같이

마크 업을 감안할 때, 그것은 그러나

<p:commandButton ... update=":list:list2" /> 

, 또 다른 잠재적 인 문제가있을 수 있습니다. 대화 상자에 양식을 제공하는 대신 <p:dialog modal="true">내부에 양식을 사용하고 있습니다. 이 방법은 HTML DOM 트리에서 자바 스크립트 (아약스를 다루는 책임자)가 대화 상자를 찾지 못할 수도 있습니다. 대화 상자에 자체 양식을 제공하면이 문제를 해결할 수 있습니다. 또한이 관련 질문에서 다루는 대화 상자 내부에서 액션을 호출 할 때 발생할 수있는 잠재적 인 문제점을 수정합니다 : <p:commandbutton> action doesn't work inside <p:dialog>.

<h:form id="viewForm"> 
    ... 
    <p:commandButton ... update=":editDialog" /> 
    ... 
</h:form> 

<p:dialog id="editDialog" modal="true"> 
    <h:form id="editForm"> 
     ... 
    </h:form> 
</p:dialog> 

Answer 2

시도 항목을 명령 단추를 편집 할 update="list2"를 추가 (심지어 update="@widgetVar(edit_entries)" 작동합니다).

페이지 레이아웃과 구조로 인해 위의 제안 사항을 사용하여 두 번째 데이터 테이블을 타겟팅 할 수 없다면 styleClass="tList2"을 두 번째 테이블에 추가하고 편집 버튼에서 update="@(.tList2)"으로 업데이트하십시오.