p:ajax更新后错误地显示数据表

时间:2017-05-30 20:04:12

标签: ajax jsf primefaces datatable

我有一个primefaces数据的问题,我在列上有一个过滤器,在过滤结果之前我的数据表正确显示如下:

good display

当我选择滤镜时,滤镜的组合框是正确的poulated:

Display of the filter list

很快我选择过滤器的项目,结果被正确过滤但我有这样的数据表显示:

Wrong display

我只看到应该在数据表中显示的结果,但表格已经消失。

代码似乎很好,我不知道问题出在哪里:

<p:outputPanel autoUpdate="true" class="ui-g-12">
                <div class="card">
                    <h1>Gestion des noeuds</h1>
                    <h:form>

                        <p:dataTable value="#{nodeController.nodes}"
                                     var="node"
                                     tableStyle="table-layout: auto;"
                                     rowKey="#{node.nodeId}"
                                     paginator="true"
                                     paginatorPosition="bottom"
                                     paginatorAlwaysVisible="false"
                                     rows="15"
                                     widgetVar="nodeTable"
                                     filteredValue="#{nodeController.filterNodes}"
                                     editable="true"
                                     selection="#{nodeController.selectedNode}"
                                     selectionMode="single"
                                     paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}">

                            <p:column headerText="ID">
                                <h:outputText value="#{node.nodeId}"/>
                            </p:column>
                            <p:column headerText="Nom">
                                <h:outputText value="#{node.modeName}"/>
                            </p:column>
                            <p:column headerText="Description">
                                <h:outputText value="#{node.nodeDescription}"/>
                            </p:column>                  
                            <p:column filterBy="#{node.typeNodeId}" filterMatchMode="exact" headerText="Type">
                                <f:facet name="filter">
                                    <p:selectOneMenu onchange="PF('nodeTable').filter()">
                                        <f:selectItem itemLabel="filtre" itemValue="#{null}" noSelectionOption="true"/>
                                        <f:selectItems value="#{nodeController.nodeTypes}"/>
                                    </p:selectOneMenu>
                                </f:facet>
                                <h:outputText value="#{node.typeNodeId}"/>
                            </p:column>
                            <p:column headerText="IPv4">
                                <h:outputText value="#{node.ipv4}"/>
                            </p:column>
                            <p:column headerText="IPv6">
                                <h:outputText value="#{node.ipv6}"/>
                            </p:column>
                            <p:column headerText="powwo agent">
                                <h:selectBooleanCheckbox value="#{node.agentInstalled}"/>
                            </p:column>
                            <p:column headerText="Network status" style="text-align:center">
                                <p:graphicImage rendered="#{node.isconnected}" name="images/ConnectionStatus25.png" library="omega-layout" width="20"/>
                                <p:graphicImage rendered="#{!node.isconnected}" name="images/Siren-25.png" library="omega-layout" width="20"/>
                            </p:column>
                            <p:column>
                                <p:rowEditor/>
                            </p:column>

                        </p:dataTable>
                        <p:commandButton value="effacer"
                                         update="msg"
                                         actionListener="#{nodeController.deleteSelectedNode()}"                                                  
                                         style="width:auto;margin-bottom:10px;margin-top: 10px"/>
                    </h:form>
                </div>

            </p:outputPanel>

你是否已经通过渲染数据来解决这个问题?知道怎么解决吗?

1 个答案:

答案 0 :(得分:2)

实际上,您的头衔和第一句话不正确。这不是数据表中的错误,而是一个错误&#39;在你的代码中。在这种情况下,您不应在autoupdate="true"上使用p:outputPanel。它会更新其中发生的每个ajax更新的所有内容,包括过滤期间的ajax更新。后者更新数据表,这意味着两个冲突的更新。偏离主题:如果您创建了Minimal, Complete, and Verifiable example ,则在删除代码时已经发现了这一点。

如果在数据表上的某个filter / page / sort / ...事件上有ajax侦听器时遇到此问题,则需要面板上的autoUpdate="true"以查看包装面板中的其他事件,您还可以通过向特定事件添加ignoreAutoUpdate="true"来阻止这些特定事件发生autoUpdate。例如,

<p:ajax event="filter" ignoreAutoUpdate="true" ... />