【问题标题】:How To Execute A Method Via Remote Command To Reset Datatable Filters?如何通过远程命令执行方法来重置数据表过滤器?
【发布时间】:2018-12-05 16:26:25
【问题描述】:

在下面的 index.xhtml 页面中,我有 3 个命令按钮,单击它们时会重定向到另一个包含数据表的.xhtml 页面,在完成时会对其进行过滤:

<ui:composition>
  <h:form id="kpiForm">
     <p:panel id="kpiPanel" >
        <p:commandButton value="filter 1" action="/app/index" oncomplete=" $('#MyFormID\\:MyDatatableID\\:BoxID\\:1').click(); PF('wv').filter();" onclick="rc()" />
        <p:commandButton value="filter 2" action="/app/index" oncomplete=" $('#MyFormID\\:MyDatatableID\\:BoxID\\:2').click(); PF('wv').filter();" onclick="rc()" />
        <p:commandButton value="filter 3" action="/app/index" oncomplete=" $('#MyFormID\\:MyDatatableID\\:BoxID\\:3').click(); PF('wv').filter();" onclick="rc()" />
     </p:panel>
     <p:remoteCommand name="rc" actionListener="#{datatableController.clearAllFilters}" />
  </h:form>
</ui:composition>

在另一个.xhtml 中有一个按钮,单击该按钮会清除应用于数据表的所有过滤器:

<!-- some code ommited -->
<ui:composition [...]>
  <h:form id="OutsideFormID">
    <p:panel id="MyPanelID" header="Some Title">

      <p:commandButton value="Reset Table" onclick="PF('wv').clearFilters()" actionListener="#{datatableController.clearAllFilters}" update="MyDatatableID">
        <p:resetInput target="MyDatatableID" />
      </p:commandButton>

        <p:dataTable id="MyDatatableID"
        value="#{datatableController.items}"
        rowKey="#{item.id}"
        var="item"
        selection="#{datatableController.selected}"
        filteredValue="#{datatableController.filteredDemandas}"
        widgetVar="wv">

            <p:column id="MyColumnID" sortBy="#{item.status.statusName}" filterBy="#{item.status.statusName}" filterMatchMode="in" >
            <f:facet name="header">
                <h:outputText value="STATUS"/>
            </f:facet>
            <f:facet name="filter">
                <p:selectCheckboxMenu id="BoxID" widgetVar="BoxWV" label="status" onchange="PF('wv').filter()">
                    <f:selectItems id="ComboID" value="#{datatableController.statusListCombo}" />
                </p:selectCheckboxMenu>
            </f:facet>
            <h:outputText value="#{item.status.statusName}"/>
            </p:column>
        </p:dataTable>
    </p:panel>
  </h:form>
</ui:composition>

当我点击 filter 3 按钮时,包含数据表的 another.xhtml 被加载,完成后,数据表将按预期过滤。但是,如果我单击另一个过滤器按钮(例如 filter 2),之前应用的过滤器会保持活动状态,从而导致不需要的过滤;如果我再次单击其对应的过滤器按钮,则此以前应用的过滤器将被禁用。

我尝试使用remote command 调用 clearAllFilters 方法,但没有成功。

public void clearAllFilters() {
  DataTable dataTable = (DataTable) FacesContext.getCurrentInstance().getViewRoot().findComponent("OutsideFormID:MyDatatableID");

  if (!dataTable.getFilters().isEmpty()) {
  dataTable.reset();

  RequestContext requestContext = RequestContext.getCurrentInstance();
  requestContext.update("OutsideFormID:MyDatatableID");
  }
}

如何在每次单击任何过滤器按钮(在 kpiForm 中)时调用 clearAllFilters 方法,并且,在完成时,数据表将被过滤?

提前感谢您的帮助。

【问题讨论】:

    标签: jquery ajax primefaces filtering


    【解决方案1】:

    我认为有一种更清洁、更简单的方法:

    您的过滤器按钮的操作应该调用一个托管 bean 方法来清除过滤器,然后重定向到 another.xhtml。比如:

        <p:commandButton value="filter 1" 
                         action="#{datatableController.pressedFilter1}" 
                         oncomplete=" $('#MyFormID\\:MyDatatableID\\:BoxID\\:1').click(); PF('wv').filter();" 
                         />
    

    在托管 bean 中:

     public String pressedFilter1(){
          this.clearAllFilters();
          return "/app/index.xhtml";
     }
    

    这将在页面加载之前清除过滤器。

    【讨论】:

    • 确实,您的解决方案比使用远程命令的解决方案更干净。但这里的问题是 clearAllFilters 方法查找尚未加载的 Datatable,因为它在 another.xhtml 上,导致 NullPointerException。所以这里的动作需要在Datatable加载完成后执行。但是我会接受您的解决方案,因为您展示的这种更简洁的方式更容易,并且允许我替换不起作用的远程命令。非常感谢奥斯卡!
    • 我明白了...也许您可以使用preRenderEventanother.xhtml 执行clearAllFilters()。您可以从 antoher.xhtml 调用它:&lt;f:event type="preRenderView" listener="#{datatableController.clearAllFilters}"/&gt;
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-02-23
    • 2013-06-06
    • 1970-01-01
    • 2013-09-01
    • 2021-08-08
    • 2013-11-22
    相关资源
    最近更新 更多