Фильтрация отформатированных дат столбца Кендо Сетка

Question

У меня есть этот 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 является только для чтения строкового свойства, которое возвращает PaymentMonth в формате "MMMM yyyy".

Вот dateFilter функция для пользовательского фильтра UI:

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

Но, фильтр никогда не работает, потому что при выборе даты в меню фильтра текущий день по умолчанию используется в качестве дневной части от даты. Например, если вы выберете Март 2016 года на 3/14/2016, дата будет 3/14/2016. Но, когда я фильтрую столбец "MMMM yyyy", меня не волнует день. Все даты в марте 2016 года должны быть включены. Как это сделать?

Answer 1

Я понял, как заставить это работать. В событии изменения выбора даты в пользовательском интерфейсе фильтра мы можем фильтровать источник данных сетки для всех дат, которые больше или равны первому дню выбранного месяца и меньше или равны последним, которые они этого месяца. Вот обновленный код функции 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>