从对话框更新表单答案

【问题标题】：Update form from dialog从对话框更新表单
【发布时间】：2013-04-04 09:47:50
【问题描述】：

我在表单中有一个数据表；在 dataTable 我有一个按钮，如果单击它会弹出一个对话框；编辑（或不编辑）后，我想关闭对话框并刷新数据表。

我想通过 ajax 事件“关闭”来做到这一点，所以即使点击取消按钮，或者通过点击转义或栏中的“x”关闭对话框 -> 他应该登陆我的 closeDialog() -方法并刷新数据表。

唯一的问题是我不知道如何刷新数据表。

这是我的数据表（在标题中是弹出对话框的按钮）：

<p:dataTable id="nzTable" widgetVar="nzTableW" emptyMessage="Keine Todos gefunden"
        var="currentTableItem" value="#{nichtZugTableController.dataModel}" paginator="true" rows="15"
        rowsPerPageTemplate="5,10,15,20, 25, 30, 1000" lazy="false" paginatorPosition="bottom"
        paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
        currentPageReportTemplate="( Treffer {totalRecords} ) ( Seite {currentPage} von {totalPages} )"
        filteredValue="#{nichtZugTableController.filteredTodos}" filterDelay="500" filterEvent="keyup"
        editable="true" sortBy="#{currentTableItem.angelegtAm}" sortOrder="descending"
        rendered="#{loginBean.loggedIn and mitViewController.leiterViewActiv and leiterTreeController.nzTableActive}"
        selection="#{nichtZugTableController.selectedNZTodos}" rowKey="#{currentTableItem.meldungId}"
        resizableColumns="false" style="min-width:1200px !important; "> 

        <f:facet name="header">
            <p:commandButton value="Zuordnen" id="nzAllTableOrdeZuButton" ajax="true" partialSubmit="true"
                process="@this" label="ToDo einem Mitarbeiter zuordnen" oncomplete="zuordnenDialogW.show();"
                disabled="#{not nichtZugTableController.hasSelectedNZTodos}"
                action="#{nichtZugTableController.doToDoArrayToList()}" style="float: left;" />
            <pe:tooltip for="nzAllTableOrdeZuButton" value="Ausgwählte ToDos einem Benutzer zuweisen"
                myPosition="left center" atPosition="right center" showEffect="fadeIn" hideEffect="fadeOut"
                showDelay="700" />
            <h:outputText value="#{nichtZugTableController.tableHeaderName}"
                style="color:#cf0008; font-size: 22px;" />
        </f:facet> 

        ...

</p:dataTable>

这是我的对话：

<body>
<ui:composition>
    <h:form id="zuordnenDialogForm">
        <p:dialog id="zuordnenDialog" widgetVar="zuordnenDialogW" closeOnEscape="true" dynamic="true"
            header="Zuordnung" appendToBody="false" draggable="true" modal="true" resizable="false">
            <p:ajax event="close"  listener="#{zuordnenDialogController.closeDialog()}" />

             ...

        </p:dialog>

编辑 1：

这是一张图片，也许有帮助

http://i.stack.imgur.com/pGjes.jpg

【问题讨论】：

我已经尝试过update=":nzTableForm:nzTable"，但出现以下错误：Cannot find component with identifier ":nzTableForm:nzTable" referenced from "zuordnenDialogForm:zuordnenDialog"

标签： html ajax jsf primefaces

【解决方案1】：

你试过了吗

<p:ajax event="close"  listener="#{zuordnenDialogController.closeDialog()}" update=":nzTable"/>

update=":nzTable" 带有完整路径，可能是：:form_main:nzTable

我想发表评论，但我没有足够的声誉。

【讨论】：

是的，我试过了，但我收到以下错误：Cannot find component with identifier ":nzTableForm:nzTable" referenced from "zuordnenDialogForm:zuordnenDialog"
您可以在Chrome浏览器中使用“检查元素”功能查看数据表的完整路径。
RongNK 我在哪里可以找到完整路径？
我很确定这是完整路径 - nzTableForm:nzTable
RongNK 看看我添加的图片

【解决方案2】：

您可以为对话框中的每个组件管理 ajax 事件，例如：

   <p:dialog id="zuordnenDialog" widgetVar="zuordnenDialogW" closeOnEscape="true" dynamic="true"
        header="Zuordnung" appendToBody="false" draggable="true" modal="true" resizable="false">

      <p:selectOneMenu id="idp" value="#{...}" converter="clientesConverter"  panelStyle="width:500px"  
                                         effect="fade" var="p" style="width:500px"  filter="true" filterMatchMode="contains">  

                            <f:selectItems value="#{comunMB.itemsClientes}"/>  

                            <f:ajax execute="@this"  listener="#{...}" render="table1 table2 table..." />
                        </p:selectOneMenu> 

    </p:dialog>

在编辑对话框时，更改会显示在表格（或其他组件）中。您也可以使用就地组件。

【讨论】：