Primefaces Datatable（日期列）按日曆篩選

Question

我正在使用PF 5.1。我想在此處按日曆設置primefaces日曆過濾Primefaces數據表（日期列）。 可能嗎？ - 請幫助任何人。

Answer 1

對於舊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

Answer 2

你應該能夠做到這一點是這樣的：

<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 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); 
    } 
} 

本網注

• 我我們因爲我的日期列包含時間戳。這是爲了確保我在特定的日期過濾，而不考慮時間戳。如果我的輸入是日期，那麼表視圖將是空的。
• <p:ajax event="change" ...>需要重置表格視圖時刪除過濾器輸入。我不確定這是否是正確的處理方法，我現在正在使用它，直到找到更好的方法。

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> 

我希望它能夠幫助別人

解決方案