从对话框中更新 PrimeFaces 数据表行



我有一个数据表,里面有一个行扩展器,其中包含两个面板,一个是常规文本,一个包含注释列表。我有一个允许用户添加新评论的按钮。现在该对话框采用单独的形式,请参阅下面的代码。我的问题是,添加评论后,保存所有评论的面板不会刷新。下面是一个代码示例。

 <h:form id="formName">

        <p:dataTable  id="prTable" rowIndexVar="index" sortMode="multiple" styleClass="iris_table" var="value" value="#{bean.listValues}"  
                     paginator="true"  rows="10" paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                     rowsPerPageTemplate="5,10,15">
            <p:ajax event="rowToggle" onstart="rowMutalExclusive();"/>

            <p:column style="width:2%">  
                <p:rowToggler />
            </p:column> 

            <p:column id="message"   
                      headerText="Description" 
                      filterMatchMode="contains" filterStyle="display: none;">  
                <h:outputText value="#{value.description}" />  
            </p:column>  

            <p:column id="deadline" headerText="Deadline" filterStyle="display: none;">  
                <h:outputText  value="#{value.endDate}">
                    <f:convertDateTime pattern="dd.MM.yyyy " />
                </h:outputText>
            </p:column>  
            <p:rowExpansion > 
                <div class="iris_peerreview_details">
                    <div class="comments">
                        <p:commandButton value="Comment" process="@this" update=":dialogForm:commentDlg" oncomplete="commentDialog.show()">  
                            <f:setPropertyActionListener target="#{bean.review}" rendered="check" value="#{value.review}"></f:setPropertyActionListener>     
                        </p:commandButton>
                        <div class="clear"></div>
                    </div>
                    <p:panel id="pnlHelp"  style='border:none'>
                        <p:dataList id="check" rowIndexVar="index" value="#{bean.commentsFromCase(value.review)}" var="commentReview"> 
                            <div class="messages">
                                <p> 
                                    <h:outputText value="#{commentReview.date}">
                                        <f:convertDateTime pattern="MM.dd.yyyy 'at' h:mm a"></f:convertDateTime>
                                    </h:outputText>  
                                </p>
                                <p class="message">
                                    <h:outputText styleClass="message"  value="#{commentReview.comment}"/>
                                </p>
                            </div>
                        </p:dataList>
                    </p:panel> 
                </div>

            </p:rowExpansion> 
        </p:dataTable> 
    </h:form>
    <h:form id="dialogForm" >
        <p:dialog id="commentDlg" header="Comment" widgetVar="commentDialog" resizable="false" 
                  modal="true">
            <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:0 auto;">
                <h:outputText value="Comment"" />
                <h:inputText value="#{bean.comment}" required="true" requiredMessage="Please enter a comment" style="font-weight:bold"/>                                               
                <p:commandButton id="save" actionListener="#{bean.commentCase()}" update=":formName:prTable:pnlHelp" oncomplete="commentDialog.hide();" 
                                  value="Comment"/>
                <p:commandButton id="cancelButton" onclick="commentDialog.hide()" value="Cancel"/>
            </h:panelGrid>
        </p:dialog>
    </h:form>

你必须原谅我,因为我不得不删除一些代码并掩盖其中的一些代码,但通常这就是它的作用。现在,单击注释按钮后,就会出现对话框,并且注释将存储在数据库中,并且一切正常,但我无法让它更新包含注释的该行的面板。我猜的问题是,一旦此页面呈现面板 id 实际上是

 formName:prTable:0:pnlHelp

并且每行的值都会更改。现在我知道我在对话框中的更新无法找到 id,但是如果我输入索引并尝试在渲染时创建此指定 id,它会抛出找不到的异常。

我尝试将对话框放在 dataTable 中,更新工作正常,但它会导致更多问题,所以我不得不放弃该选项。另外,如果我更新整个表,它还可以,但问题是行扩展器关闭了,这不是它所需要的,而且它真的不喜欢刷新整个表,因为这不是这样做的目的。如果有帮助,我正在使用Primeface 4.0。使用 jsf 2.0。

是的,id 的值会因每一行而变化。尝试使用 css 选择器更新它,将您的按钮更改为

<p:commandButton id="save" actionListener="#{bean.commentCase()}" update="@([id$=pnlHelp])" oncomplete="commentDialog.hide();" 
                                  value="Comment"/>

该代码将更新所有以"pnlHelp"结尾的组件。更多信息: http://www.w3schools.com/cssref/css_selectors.asp

最新更新