ajax - Primefaces p :overlayPanel is empty when update attribute is used in child tag

Question

我想在覆盖面板内显示数据表中的键值对列表，其中每一对是一行。单击键值对时，我想更新 <p:inputText> -Element，位于覆盖面板之外，具有所选行的键值，同时关闭覆盖面板。

我刚刚从 PF 4.0 迁移到 PF 6.1，现在我面临这个问题，每当我在覆盖面板中使用更新属性时，它似乎是空的，没有显示任何内容。

这是一个代码示例:

<p:inputText
        id="inputPvId"
        styleClass="form_input"
        readonly="true"
        value="#{bean.selectedValue.get(0)}" />
                <p:commandButton
                icon="ui-icon-link"
                id="selectValue"
                value="#{msg_properties.chooseValue}" />

                <p:overlayPanel
                        for="selectValue"
                        id="overlayValueSelector"
                        widgetVar="overlayValueSelector
                        dynamic="true"
                        styleClass="form_input_widest">

                        <p:dataTable
                                var="car"
                                value="#{dtBasicView.cars}">
                                        <p:column
                                               headerText="Id">
                                                      <h:outputText
                                                             value="#{car.id}" />
                                        </p:column>

                                        <p:column
                                               headerText="Year">
                                                      <h:outputText
                                                             value="#{car.year}" />
                                        </p:column>

                                        <p:ajax
                                               event="rowSelect"
                                               update=":form:inputPvId,:form:myTable"
                                               onsuccess="PF('overlayPV').hide()" />
                        </p:dataTable>

以前它是这样工作的。我所改变的只是从 "overlayPV".hide()" 调用 Widget 的方式。至 "PF('overlayPV').hide()"正如官方迁移指南所建议的那样。如果取消掉 update=":form:inputPvId,:form:myTable" ajax 调用中的行，内容会正确显示。

我做错了什么吗？我的研究表明，其他人在覆盖面板和 ajax 更新方面也遇到了麻烦。但是，我没有找到适合我的问题的解决方案。

我尝试使用“onRowClick”-数据表的属性以及 widgetHide 调用，如下所示:

<p:dataTable
        onRowClick="PF('overlayPV').hide()" /> 

它工作正常，但是我不知道如何更新 <p:inputText> - 具有所选值的元素。我必须刷新页面才能显示新值。如果有人为此提出解决方案，我会很高兴。提前致谢。

Answer 1

我终于解决了这个问题。

我最初的问题是，每当 <p:overlayPanel> 中的元素包含“update”属性，overlayPanel 没有呈现任何内容并且显示为空。

我用 <p:remoteCommand> 解决了我的问题-Tag，我将其放置在 overlayPanel 的外部，如下面的示例代码所示:

<p:inputText
        id="inputPvId"
        styleClass="form_input"
        readonly="true"
        value="#{bean.selectedValue.get(0)}" />
                <p:commandButton
                icon="ui-icon-link"
                id="selectValue"
                value="#{msg_properties.chooseValue}" />

                <p:overlayPanel
                        for="selectValue"
                        id="overlayValueSelector"
                        widgetVar="overlayValueSelector
                        dynamic="true"
                        styleClass="form_input_widest">

                        <p:dataTable
                                var="myTable"
                                value="#{dtBasicView.cars}"
                                onRowClick="remoteCommand()">
                                        <p:column
                                               headerText="Id">
                                                      <h:outputText
                                                             value="#{car.id}" />
                                        </p:column>

                                        <p:column
                                               headerText="Year">
                                                      <h:outputText
                                                             value="#{car.year}" />
                                        </p:column>

                        </p:dataTable>
                 </p:overlayPanel>
                 <p:remoteCommand
                                        name="remoteCommand"
                                        update="inputPvId, myTable"                                         
                                        onsuccess="PF('overlayPV').hide()"/>

请注意我的数据表的 onRowClick-Attribute，它在 overlayPanel 之外调用 remoteCommand。 remoteCommand 更新了我所有需要更新的元素，并关闭了 overlayPanel。