引用datatable更新datatable [英] Primefaces datatable update datatable

问题描述

我对于原理数据表有问题。我有一个数据表，一些条目和一个带有一个按钮的列。如果按下该按钮，则使用另一个数据表打开弹出窗口。第二个数据表中的条目取决于按下按钮的行。

I have a problem with primefaces datatables. I have one datatable with some entries and a column with a button inside. If the button is pressed a popup is opened with another datatable. The entries in the second datatable are depending on the row in which the button is pressed.

<!-- first datatable -->
<h:form id="list">
<p:dataTable id="list1" var="item" value="#{bean1.itemlist}"
   rowKey="#{item.id}" selection="#{bean1.selectedItem}"
   selectionMode="single">

    <p:column headerText="ID">
        <h:outputText value="#{item.id}" />
    </p:column>
    ...
    <p:column headerText="Edit Entries">
        <p:commandButton value="Edit Entries"
            actionListener="#{bean2.updateEntries(item)}" ajax="true"
            oncomplete="PF('edit_entries').show()" />

         </p:column>
</p:dataTable>

<!-- Second datatable in the popup -->
<p:dialog header="Edit Entries" widgetVar="edit_entries" modal="true"
    resizable="false">
        <p:dataTable id="list2" var="entry"
            value="#{bean2.entriesList}" rowKey="#{entry.id}"
            selection="#{bean2.selectedEntry}" selectionMode="single">
            <p:column headerText="Entry Number">
                <h:outputText value="#{entry.number}" />
            </p:column>
        </p:dataTable>
        <f:facet name="footer">
             <p:commandButton value="Save" oncomplete="PF('edit_entries').hide()" />
        </f:facet>
</p:dialog>
</form>

Bean2

public void updateEntries(Item selectedItem) {
    this.entriesList = this.entriesQuery.getAllEntriesByItemID(selectedItem.getId());//db query could take some time
    System.out.println("entrieslist size: " + this.entriesList.size()); //prints the correct size
}

问题是没有列出的条目弹出的datatable虽然在数据库查询后有一些列表。

The problem is that there are no entries listed in the popup datatable although there are some in the list after the db query.

任何想法如何解决这个错误？
提前感谢！

Any ideas how to fix this bug? Thanks in advance!

更新1：

<!-- first datatable -->
<h:form id="list">
<p:dataTable id="list1" var="item" value="#{bean1.itemlist}"
   rowKey="#{item.id}" selection="#{bean1.selectedItem}"
   selectionMode="single">

    <p:column headerText="ID">
        <h:outputText value="#{item.id}" />
    </p:column>
    ...
    <p:column headerText="Edit Entries">
        <p:commandButton value="Edit Entries" update=":dialogUpdateEntries"
            actionListener="#{bean2.updateEntries(item)}" ajax="true"
            oncomplete="PF('edit_entries').show()" />

         </p:column>
</p:dataTable>
</h:form>

<!-- Second datatable in the popup -->
<p:dialog header="Edit Enries" id="dialogUpdateEntries" widgetVar="edit_entries" modal="true"
    resizable="false">
    <h:form id="formEntriesList">
        <p:dataTable id="list2" var="entry"
            value="#{bean2.entriesList}" rowKey="#{entry.id}"
            selection="#{bean2.selectedEntry}" selectionMode="single">
            <p:column headerText="Entry Number">
                <h:outputText value="#{entry.number}" />
            </p:column>
        </p:dataTable>
        <f:facet name="footer">
             <p:commandButton value="Save" oncomplete="PF('edit_entries').hide()" />
        </f:facet>
    </form>
</p:dialog>

推荐答案

您确实没有更新数据表对话。 JSF不会自动更新模型的更改视图，您必须明确地告诉视图才能这样做。您可以使用ajax操作组件的更新属性。这需要一个JSF客户端ID，可以按照相关答案中所述的规则找到：找不到表达式foo的组件从bar引用 - < f：ajax>包含未知idfoo不能在组件bar的上下文中找到它。

You're indeed not updating the data table in the dialog. JSF doesn't automatically update the view on change of the model, you have to explicitly tell the view to do so. You can use the ajax action component's update attribute for this. This takes a JSF client ID which can be found by rules as outlined in this related answer: Cannot find component with expression "foo" referenced from "bar" - <f:ajax> contains unknown id "foo" cannot locate it in context of component "bar".

鉴于问题所示的标记，那将是

Given the markup as shown in the question, that'll be

<p:commandButton ... update=":list:list2" />

然而，还有一个潜在的问题。您正在使用< p：dialog modal =true> 内部表单，而不是将对话框提供给自己的表单。这样，HTML DOM树中的对话框可能不可用，因为JavaScript（负责处理ajax的东西）将期望找到它。给对话框自己的形式应该解决这个问题。它还将修复在此相关问题中处理的对话框内调用操作的潜在未来问题：< p：commandbutton>

However, there's another potential problem. You're using <p:dialog modal="true"> inside a form instead of giving the dialog its own form. This way the dialog may not be available in the HTML DOM tree as JavaScript (the one responsible for dealing with ajax stuff) would expect to find it. Giving the dialog its own form should fix this matter. It'll also fix the potential future problems with invoking actions from inside the dialog as handled in this related question: <p:commandbutton> action doesn't work inside <p:dialog>.

<h:form id="viewForm">
    ...
    <p:commandButton ... update=":editDialog" />
    ...
</h:form>

<p:dialog id="editDialog" modal="true">
    <h:form id="editForm">
        ...
    </h:form>
</p:dialog>

这篇关于引用datatable更新datatable的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！