从另一个选项卡内的另一个数据表更新选项卡内的 primefaces 数据表

Question

大家好，我在更新某些组件时遇到问题，我正在使用 JSF、Primefaces 5.3、Hibernate。

我有一个包含数据表的选项卡：tab 1，我还有另一个选项卡tab 2 我想要做的是当我更改选项卡 2 中的 Farmaceutica 列并单击 Guardar Cambios 我想更新选项卡 1 的数据表。我可以更新数据库，当我注销并再次登录时，更改就在那里，但我希望在不注销的情况下进行更改。

这是我的 admin.xhtml：

<h:form id="frm">
    <p:growl id="growl" life="3500" sticky="false" showDetail="true" />
    <div class="navbar color-bar"></div>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-7">
                <div class="row">
                    <div class="col-md-12">
                        <p:tabView id="tabs">
                            <p:tab title="Estado asignaciones">
                                <p:panel id="panelEstado">
                                    <h:form id="formDta">
                                        <p:dataTable
                                            value="#{estadoAsignaciones.listaEstadoAsignaciones}"
                                            var="data" paginator="true" rowKey="#{data.idAuditor}"
                                            rows="10" selectionMode="single"
                                            selection="#{estadoAsignaciones.estadoAsignaciones}">
                                            <p:ajax event="rowSelect"
                                                listener="#{estadoAsignaciones.onRowSelect()}"
                                                onstart="PF('blockUIWidget').show()"
                                                oncomplete="PF('overPnl').show()" update="frm" />
                                            <p:column headerText="Auditor">
                                                <h:outputLabel
                                                    value="#{data.nombreAuditor} #{data.apellidoAuditor}" />
                                            </p:column>
                                            <p:column headerText="Farmacéutica">
                                                <h:outputLabel value="#{data.farmaceuticaAsignada}" />
                                            </p:column>
                                            <p:column headerText="Progreso">
                                                <p:progressBar value="#{data.porcentaje}"
                                                    labelTemplate="{value}%" id="avanceBar" style="width:80%" />
                                            </p:column>
                                        </p:dataTable>
                                    </h:form>
                                </p:panel>
                                <p:overlayPanel id="panelOver" widgetVar="overPnl"
                                    showEffect="fade" hideEffect="fade" dismissable="false"
                                    showCloseIcon="true">
                                    <p:panel id="avance" header="Avance auditoria"
                                        class="space robotome">
                                        <p:progressBar id="avanceBar"
                                            value="#{estadoAsignaciones.porcentajeValue}"
                                            style="width:100%" labelTemplate="{value}%" />
                                    </p:panel>
                                    <p:panel id="tiempo" header="Tiempo" class="space robotome">
                                        <h:outputLabel
                                            value="Fecha inicio: #{estadoAsignaciones.fecha}" />
                                        <br />
                                        <h:outputLabel
                                            value="Fecha Actual: #{estadoAsignaciones.fechaActual}" />
                                        <br />
                                        <h:outputLabel
                                            value="Hora inicio: #{estadoAsignaciones.hora}" />
                                        <br />
                                        <h:outputLabel
                                            value="Tiempo transcurrido: #{estadoAsignaciones.calHoraDif} horas" />
                                    </p:panel>
                                    <p:panel id="auditor" header="Auditor" class="robotome">
                                        <p:outputLabel
                                            value="Nombres: #{estadoAsignaciones.getEstadoAsignaciones().nombreAuditor}" />
                                        <br />
                                        <p:outputLabel
                                            value="Apellidos: #{estadoAsignaciones.getEstadoAsignaciones().apellidoAuditor}" />
                                    </p:panel>
                                </p:overlayPanel>
                                <p:blockUI block="frm" widgetVar="blockUIWidget">
                                    <p:graphicImage name="imgs/loading.gif" width="50" height="50" />
                                </p:blockUI>
                            </p:tab>
                            <p:tab title="Asignaciones">
                                <p:dataTable id="dtA"
                                    value="#{asignacionesBean.seleccionAuditores}" var="auditor"
                                    paginator="true" rows="5">
                                    <p:column headerText="Auditor">
                                        <h:outputText value="#{auditor.nombreAuditor}" />
                                    </p:column>
                                    <p:column headerText="Farmaceutica">
                                        <p:selectOneMenu value="#{auditor.idFarmaceutica}">
                                            <f:selectItem itemLabel="#{data.farmaceutica}"
                                                noSelectionOption="true" itemDisabled="true" itemValue="" />
                                            <f:selectItems
                                                value="#{asignacionesBean.mapSeleccionFarmaceuticas}" />
                                        </p:selectOneMenu>
                                    </p:column>
                                    <p:column>
                                        <p:commandButton value="Guardar cambios" update=":frm"
                                            actionListener="#{asignacionesBean.guardarRespuestaAsignaciones(auditor)}"
                                            process="@this"
                                            onclick="PF('blockUIWidgetAsignaciones').hide()"
                                            onsuccess="PF('blockUIWidgetAsignaciones').show()" />
                                    </p:column>
                                </p:dataTable>

感谢您的帮助。

Answer 1

我不明白你为什么在表单中使用表单。删除除主表单外的所有表单。

在您的第一个选项卡中，将 id 添加到您的数据表中。并将prependId=false 放到您的面板网格中，如下所示。

<p:panel id="panelEstado" prependId="false">
     <p:dataTable id="firstTable" value="#{estadoAsignaciones.listaEstadoAsignaciones}"
      var="data" paginator="true" rowKey="#{data.idAuditor}"
      rows="10" selectionMode="single" selection="#{estadoAsignaciones.estadoAsignaciones}">

然后在选项卡 2 的 Farmaceutica 列中更改代码，如下所示

<p:selectOneMenu value="#{auditor.idFarmaceutica}">
 <f:selectItem itemLabel="#{data.farmaceutica}" noSelectionOption="true"  itemDisabled="true" itemValue="" />
 <f:selectItems value="#{asignacionesBean.mapSeleccionFarmaceuticas}" />
 <p:ajax event="valueChange" update=":firstTable"/>
</p:selectOneMenu>

在 Guardar Cambios 中将您的代码更改为这个。

<p:commandButton value="Guardar cambios" update=":firstTable" actionListener="#{asignacionesBean.guardarRespuestaAsignaciones(auditor)}" process="@this"
onclick="PF('blockUIWidgetAsignaciones').hide()" onsuccess="PF('blockUIWidgetAsignaciones').show()" />