2016-03-14 102 views
3

的格式化的日期欄我在格有這個DateTime列:過濾一個劍道電網

column.Bound(c => c.PaymentMonth).ClientTemplate("#= PaymentMonthString #") 
      .Filterable(filterable => filterable 
      .Operators(op => op.ForDate(d => d.Clear().IsEqualTo("Equals"))) 
      .Extra(false).UI("dateFilter")); 

PaymentMonthString是,在"MMMM yyyy"格式返回PaymentMonth只讀字符串屬性。

這裏的自定義過濾器UI的dateFilter功能:

<script> 
    function dateFilter(e) { 
     e.kendoDatePicker({ 
      format: "MMMM yyyy", 
      depth: "year", 
      start: "year" 
     }); 
    } 
</script> 

但是,過濾器永遠不會奏效,因爲當你選擇在濾鏡菜單中的日期,當天使用默認的日期部分的日期。例如,如果您選擇2016年3月14日的2016年3月,日期將爲2016年3月14日。但是,當我在"MMMM yyyy"列上過濾時,我不在乎這一天。應包括2016年3月的所有日期。我如何做這項工作?

+0

你需要使用自定義過濾器來實現自己的目標 – user5135401

+2

我知道。但是,如何? – ataravati

回答

1

我想如何讓這個工作。在篩選器UI中的日期選擇器的更改事件中,我們可以篩選網格的數據源,以查找大於或等於所選月份的第一天並且小於或等於最後一個日期的所有日期那個月。下面是爲dateFilter功能更新後的代碼:

<script> 
    function dateFilter(e) { 
     e.removeAttr("data-bind"); 
     e.kendoDatePicker({ 
      format: "MMMM yyyy", 
      depth: "year", 
      start: "year", 
      change: function() { 
       var ds = $("#grid").data().kendoGrid.dataSource; 
       var filter = { 
        "logic": "and", 
        "filters": [ 
         { 
          "field": "PaymentMonth", 
          "operator": "gte", 
          "value": new Date(this.value().getFullYear(), this.value().getMonth(), 0) 
         }, 
         { 
          "field": "PaymentMonth", 
          "operator": "lte", 
          "value": new Date(this.value().getFullYear(), this.value().getMonth() + 1, 0) 
         } 
        ] 
       }; 
       ds.filter(filter); 
       this.element.closest("form").data().kendoPopup.close(); 
      } 
     }); 
    } 
</script> 
+0

12月份會失敗嗎? 12 + 1 = 13 – thepirat000

+0

@ thepirat000,不,它沒有。在這種情況下,年份將增加1,並且該月份將變爲1月份。 – ataravati