Primefaces Datatable(日期列)按日历筛选
问题描述:
我正在使用PF 5.1。我想在此处按日历设置primefaces日历过滤Primefaces数据表(日期列)。 可能吗? - 请帮助任何人。Primefaces Datatable(日期列)按日历筛选
答
对于旧PrimeFaces版本的解决方案必须像这个答案一样实施,对于新版本,其他答案包含解决方案。
基本上,这可以实现这样的:
- 使用隐藏的输入字段(如)在滤波器面隐藏默认滤波器输入字段
- 在放
p:calendar
标题方面 - 将日期选择事件添加到日历中。在
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
答
你应该能够做到这一点是这样的:
<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>
答
我对我的网站也有要求。不过,我从@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);
}
}
本网注
- 我我们因为我的日期列包含时间戳。这是为了确保我在特定的日期过滤,而不考虑时间戳。如果我的输入是日期,那么表视图将是空的。
-
<p:ajax event="change" ...>
需要重置表格视图时删除过滤器输入。我不确定这是否是正确的处理方法,我现在正在使用它,直到找到更好的方法。
答
我知道这个问题被问前一段时间,但这里是我的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>
我希望它能够帮助别人
解决方案