Question

我有一个产品列表，显示在datatable中，并希望在弹出窗口中编辑数据表中的特定行，如下所述

包含所有员工详细信息的数据表，每行都有编辑按钮。单击编辑按钮时，新的弹出窗口应显示特定点击产品的现有信息，编辑后，必须反映特定的更改列表中的对象以及数据表中的对象。

我正在努力，但我无法保存已编辑产品的更改。当弹出窗口打开时，我可以看到所选的项目属性，但是当我更改属性时，没有任何变化。这是我的jsf代码。

<a4j:outputPanel ajaxRendered="true">
    <h:dataTable id="table1" value="#{productBean.products}" var="item"
        styleClass="resultTable" headerClass="resultTableHeader"
        rowClasses="resultTableRow">
        <h:column>
            <f:facet name="header">
                <h:outputText value="Part#" />
            </f:facet>
            <h:outputText value="#{item.partNumber}" />
        </h:column>

        <h:column>
            <f:facet name="header">
                <h:outputText value="Product Description" />
            </f:facet>
            <h:outputText value="#{item.description}" />
        </h:column>
        <h:column>  
        <a4j:commandButton value="Edit" action="#{productBean.setEditItem(item)}" oncomplete="#{rich:component('popup')}.show()"> </a4j:commandButton>

                    <rich:popupPanel  id="popup" modal="true" resizeable="true"
                onmaskclick="#{rich:component('popup')}.hide()">
                <f:facet name="header">
                    <h:outputText value="Edit property of the product" />
                </f:facet>
                <f:facet name="controls">
                    <h:outputLink value="#"
                        onclick="#{rich:component('popup')}.hide(); return false;">
                      X
                  </h:outputLink>
                </f:facet>
                <!-- editProduct ı burda item yerine kullan  -->                    
                <table style="align: center;">
                    <tr>
                        <td><h:panelGrid columns="2">
                                <h:outputText value="Description"></h:outputText>
                                <h:inputText value="#{productBean.item.description}"></h:inputText>
                            </h:panelGrid></td>
                    </tr>
                    <tr>
                        <td><h:panelGrid columns="2">
                                <h:outputText value="Part Number"></h:outputText>
                                <h:inputText value="#{item.partNumber}"></h:inputText>
                            </h:panelGrid></td>
                    </tr>
                </table> 
                    <a4j:commandButton value="Submit" action="#{productBean.actionEditProductsFromDatabase(item)}"  execute="@popup"/>
                    <a4j:commandButton value="Cancel" onclick="#{rich:component('editPane')}.hide(); return false;" />
            </rich:popupPanel>
        </h:column>
    </h:dataTable>

</a4j:outputPanel>

</h:form>

Answer 1

请参阅RichFaces组件参考中的 Placement 标注：

http://docs.jboss.org/richfaces/latest_4_X/Component_Reference/en-US/html_single/#sect-Component_Reference-Panels-richpopupPanel

<rich:popupPanel>组件通常在任何组件前面呈现   页面上的其他对象。这是通过连接组件来实现的   到页面的<body>元素，并设置一个非常高的“z-index”   （对象的堆栈顺序）。采用这种方法是因为   如果相对定位的元素仍然可以与弹出式面板重叠   它们存在于DOM层次结构的更高级别，即使它们是   z-index小于<rich:popupPanel>组件。

如果<rich:popupPanel>是参与提交孩子   组件/行为，然后表单元素必须嵌套在   <rich:popupPanel> 即可。或者，如果不存在重叠元素，   <rich:popupPanel>组件可以重新附加到其原始DOM   将domElementAttachment设置为父级或表单。

dataTable-popupPanel主 - 详细信息不保存已编辑的值

1 个答案: