Блог

У меня есть следующая сетка кендо, у меня есть дата заказа как MM/yyyy . В источнике данных дата заказа хранится как MM/dd/yyyy .

 @(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()    
    .Name("grid")
    .Columns(columns => {
        columns.Bound(p => p.OrderID).Filterable(false).Width(100);
        columns.Bound(p => p.Freight).Width(100);
        columns.Bound(p => p.OrderDate).Format("{0:MM/yyyy}").Width(140);
        columns.Bound(p => p.ShipName);
        columns.Bound(p => p.ShipCity).Width(150);
    })
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Read(read => read.Action("Orders_Read", "Grid"))
     )
)
 

Есть ли в любом случае в календаре отображение месяца и года и фильтрация сетки на основе выбранных месяца и года, игнорируя дату, как показано на скриншоте ниже?

В настоящее время на нем отображается дата выбора

Вы можете использовать пользовательский шаблон фильтра для этого столбца. Ниже приведен код jquery о том, как настроить выбор даты и времени, чтобы ограничить выбор годом и месяцем (это было взято из демонстраций KendoUI для jQuery).

 <input id="datepicker"/>
<script>
$("#datepicker").kendoDatePicker({
    depth: "year",
    start: "year"
});
</script>
 

Другим способом через конфигурацию было бы использовать пользовательский шаблон для фильтров.

 columns.Bound(p => p.OrderDate).Format("{0:MM/yyyy}").Width(140)
                .Filterable(filterable => filterable.UI("customDateTimeFilter"));

<script type="text/javascript">
     function customDateTimeFilter(element) {
         if (element == null) return;
            element.kendoDatePicker({
               depth: "year",
               start: "year"
          });
        }
</script>