编辑后刷新数据表行(添加,修改,删除...)

时间:2012-09-22 10:35:32

标签: ajax jsf-2 xhtml primefaces

  

可能重复:
  How to ajax-update the p:dataTable from inside the p:dataTable itself?

在我的xhtml页面中,我有一个包含Group类型对象的dataTable,以及一个用于将新组添加到datable并最终添加到数据库中的按钮  我正在使用sessionScoped托管Bean,所以我需要在添加新记录后刷新我的数据表行。

为此,我使用了命令Button组件的update属性,但是数据表没有刷新,这里是代码:

  <p:fieldset legend="Groups">  

     <p:commandButton id="newGroup" value=" New  Group" onclick="newGoupDlg.show();" 
      type="button" update="groupsDataTable"/>
                   <br/>

      <p:dataTable id="groupsDataTable" var="group" value="#
         {projectAdminisrationMB.groupsList}" 
                    rowKey="#{group.name}"
                     rowIndexVar="rowIndex"
                      binding="#{table}">  

                      <f:facet name="header">  

                      </f:facet>  

                         <p:column id="column2">
            <f:facet name="header">
            <h:outputText value="Group Name"></h:outputText>
            </f:facet>
         <p:graphicImage value="/images/group/#{group.name}.gif" />  


     <h:commandLink action="#{projectAdminisrationMB.showGroupDetails}" 
         value="#{group.name}">  
 <f:setPropertyActionListener target="#{projectAdminisrationMB.selectedGroup}" 
       value="#{group}" />
 <f:setPropertyActionListener target="#{projectAdminisrationMB.selectedGroupName}" 

    value="#{group.name}" />


     <f:setPropertyActionListener target="#
    {projectAdminisrationMB.selectedGroupDescription}" value="#{group.description}" />
       <f:setPropertyActionListener target="#
     {projectAdminisrationMB.selectedGroup.dbRowIndex}" value="#{table.rowIndex}" />

       </h:commandLink>

    </p:column>
        <p:column id="column3">
    <f:facet name="header">
    <h:outputText id="text3" value=" Group Description "></h:outputText>
     </f:facet>
      <h:outputText value="#{group.description}"></h:outputText>
    </p:column>


               <f:facet name="footer">  

                      </f:facet>  
                 </p:dataTable>  


             <p:dialog header="New Group" widgetVar="newGoupDlg"  width="750" 

       showEffect="explode" hideEffect="explode">  
                        <br/>   <br/>  
                        <h:outputText value=" New Group : " /> 

                        <p:inputText id="newGroupName" value="# 

             {projectAdminisrationMB.newGroup.name}">
                          <f:validator validatorId="requiredValidator"></f:validator>
                        </p:inputText>
                         <br/>   <br/>   
                         <h:outputText value="Group Description :" />  
                            <br/>   <br/>   
                         <p:editor id="newGroupDescription" value="# 


        {projectAdminisrationMB.newGroup.description}" width="600"/> 
                        <br/>   <br/>   

         **<p:commandButton id="ValidateNewGroup"  value="Validate"  
            actionListener="#{projectAdminisrationMB.addNewGroup}" 
            onclick="newGoupDlg.hide()"  update="groupsDataTable" ></p:commandButton>**


                        <p:commandButton id="CancelNewGroup" value=" Cancel " 
              onclick="newGoupDlg.hide()"></p:commandButton>

                    </p:dialog>  

                    <br/>   <br/>   

               </p:fieldset>  

任何想法都会得到赞赏

1 个答案:

答案 0 :(得分:2)

导致问题的最常见原因是数据表的ID未正确引用。

在浏览器中检查数据表的实际ID是什么。

当您的数据表位于类似于表单的容器中时,容器的ID前缀为:分隔的数据表的id(默认情况下)。

所以这个:

<h:form id="form">
    <p:dataTable id="dt" ...
</h:form>

将导致数据表的ID为form:dt

当从另一个容器中引用容器内的元素时,您需要从根开始搜索。这是通过在ID前添加:来完成的。

示例:

<h:form id="form">
    <p:dataTable id="dt" ...
</h:form>

<h:form id="btnForm">
    <p:commandButton update=":form:dt" ...
</h:form>

您也可以使用绑定:

<h:form binding="#{form}">
    <p:dataTable id="#{dt}" ...
</h:form>

<h:form id="#{btnForm}">
    <p:commandButton update=":#{dt.clientId}" ...
</h:form>