Primefaces 数据表（日期列）按日历过滤

Question

我正在使用 PF 5.1。我想通过日历设置 primefaces 日历在这里过滤 Primefaces 数据表（日期列）。是否可以？ -请帮助任何人。

Answer 1

你应该可以这样做：

<f:facet name="filter">
      <p:calendar mode="inline" />  
</f:facet>

如果你不是 layzily 过滤，那么你必须提供并实现一个 filterFunction

<f:facet name="filter" filterFunction="#{backingBean.filterByCalendar}">
      <p:calendar mode="inline" />  
</f:facet>

Answer 2

对于旧的 PrimeFaces 版本，必须像这个答案中那样实施解决方案，对于新版本，另一个答案包含解决方案。

基本上可以这样实现：

在 filter facet 中使用隐藏输入字段（如 h:inputHidden）来隐藏默认过滤器输入字段
在 headerfacet

p:calendar

在您的日历上添加一个 dateSelect 活动。在 onstart 中，用日历值替换隐藏输入的值。在 oncomplete 使用客户端 API 过滤数据表
编写您的自定义过滤器函数以根据需要比较对象值和过滤器值

请注意，p:calendar 仅供客户输入日期。如果您还需要在过滤器函数中使用正确的时间，请考虑使用额外的 TimePicker（例如 http://www.primefaces.org/showcase-ext/sections/timePicker/basicUsage.jsf）

编辑：实际上，PrimeFaces 日历在 mode="datetime" 中支持日期时间。我不知道这一点。参见 https://code.google.com/p/primefaces/issues/detail?id=648

Answer 3

我的网站也有这个要求。但是我有一个与@stg 不同的实现。在撰写本文时，我正在使用 Primefaces 5.0。这是完成这项工作的作品：

XHTML 站点

<p:dataTable id="dataTable" widgetVar="Table" var="dataItem">
   ...

   <p:column id="date" 
             headerText="Date"
             filterFunction="#{controller.filterByDate}"
             filterBy="#{dataItem.date}">
         <f:facet name="filter">
            <p:calendar id="cal1" pattern="yyyy-MM-dd">
               <p:ajax event="dateSelect" oncomplete="PF('Table').filter()" update="dataTable" />
               <p:ajax event="change" execute="@this" oncomplete="PF('Table').filter()" update="dataTable"/>
            </p:calendar>
         </f:facet>
      <p:outputLabel value="#{dataItem.date}">
         <f:convertDateTime pattern="yyyy-MM-dd HH:mm:ss" />
      </p:outputLabel>
   </p:column>

<p:dataTable>

Java 站点

@ManagedBean
@SessionScoped
public class Controller {

    public boolean filterByDate(Object value, Object filter, Locale locale) {

        if( filter == null ) {
            return true;
        }

        if( value == null ) {
            return false;
        }

        return DateUtils.truncatedEquals((Date) filter, (Date) value, Calendar.DATE);
    }
}

站点注释

我正在使用 DateUtils.truncateEquals()，因为我的日期列包含时间戳。这是为了确保无论时间戳如何，我都在特定日期进行过滤。如果我的输入只有日期，那么 table 视图将为空。
<p:ajax event="change" ...> 来重置 table 视图。我不确定这是否是处理此问题的正确方法，我目前正在使用它，直到找到更好的方法。

Answer 4

我知道不久前有人问过这个问题，但这是我使用 Primefaces 5.2 的解决方案

<f:facet name="filter">
    <p:calendar  pattern="dd/MM/yyyy">
        <p:ajax event="dateSelect"  oncomplete="PF('seasonDataTable').filter()"/>
    </p:calendar>
</f:facet>

希望对大家有所帮助

Primefaces 数据表（日期列）按日历过滤

Primefaces Datatable (date column) Filter by calendar

primefaces

jsf-2.2