kendo-grid - 剑道网格日期过滤器

Question

我正在尝试使用这里看到的剑道网格日期过滤器：http ://demos.kendoui.c​​om/web/grid/filter-menu-customization.html

我没有看到任何关于如何使用 Razor 语法执行此操作的好示例。

他们展示的唯一示例是使用 javascript：

                       {
                            field: "BirthDate",
                            title: "Birth Date",
                            format: "{0:MM/dd/yyyy HH:mm tt}",
                            filterable: {
                                ui: "datetimepicker"
                            }
                        }

我试图在我的专栏上这样做，但没有奏效：

cols.Bound(c => c.DateOfServiceString).Title("Assessment Date").Filterable(filterable => filterable.UI("datetimepicker"));

Answer 1

我有一种感觉，我偶然发现了这个问题 - 尝试在您的 Grid Helper 之后添加这个 JS 片段。

<script type="text/javascript">
    function datetimepicker(control) {
        $(control).kendoDateTimePicker();
    }
</script>

Answer 2

我的代码中有这个工作。我已将列类型定义为日期并将日期字符串转换为日期对象。

这是定义列的代码

column.field= 'c5',
column.title= "Date",
column.type = 'date',
column.template = '#= kendo.toString(c5, "g" ) #';
column.filterable = {
    operators: {
        date: {
            lt: "Lesser than",
            gt: "Greater than"
        }
    }
}

从服务器获取数据后，我将其转换为 Date 对象。

vm.feedbacks = [];
rows.forEach(function (row) {
    row.forEach(function (column, index) {
        var key = 'c' + index;
        feedback[key] = column;
        if (gridColumns.gridAllColumns[index].type === 'date') {
            feedback[key] = new Date(column);
        };
    });
    vm.feedbacks.push(feedback);
});

Answer 3

在剑道演示页面本身有一个查看 cshtml 代码的选项。这是您需要的链接。 http://demos.telerik.com/aspnet-mvc/grid/filter-menu-customization 另外，我相信如果数据以 DateTime 的形式出现，kendo 会自动将其转换为 javascript 日期对象。希望这可以帮助。