Primefaces Datatable(日期列)按日历过滤

Shi*_*hab 4 primefaces jsf-2.2

我正在使用PF 5.1.我想在这里通过日历集primefaces日历过滤Primefaces数据表(日期列). 在此输入图像描述 可能吗 ? - 请帮助任何人.

Arm*_*ndo 12

我知道这个问题刚才被问过,但这是我使用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>
Run Code Online (Sandbox Code Playgroud)

我希望它可以帮助任何人


hua*_*n68 9

我的网站上也有这个要求.但是我有一个与@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>
Run Code Online (Sandbox Code Playgroud)

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);
    }
}
Run Code Online (Sandbox Code Playgroud)

网站说明

  • 我正在使用,DateUtils.truncateEquals()因为我的日期列包含时间戳.这是为了确保我在特定日期过滤而不管时间戳.如果我的输入只是日期,那么表格视图将为空.
  • <p:ajax event="change" ...>删除过滤器输入时需要重置表视图.我不确定这是否是正确的处理方法,我现在正在使用它,直到找到更好的方法.


stg*_*stg 6

对于较旧的PrimeFaces版本,解决方案必须像在本答案中那样实现,对于newe版本,另一个答案包含解决方案.

基本上,这可以这样实现:

  • 使用过滤器构面中的隐藏输入字段(如h:inputHidden)隐藏默认过滤器输入字段
  • 把一个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