Javascript 带日期时间选择器的KendoGrid筛选器工作不正常？

这里的问题是基于日期时间选择器过滤网格数据（服务数据）。 我无法提供服务，所以我在这里使用硬代码数据，但我的要求是根据日期和时间过滤服务数据。

---

这是您将

parse

函数放置在

网格定义中而不是
数据源中的jsbin。您还需要提供与接收的格式相匹配的格式（“yyyy-MM-dd HH:MM:ss”）。试试这个：

dataSource: {
    data  : [
        { FirstName: "Joe", LastName: "Smith", dob: "2013-02-18 19:54:13"},
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-18 20:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-18 21:56:15" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-18 22:57:16" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-19 20:55:20" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-24 20:56:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-26 20:57:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-28 20:42:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-03-22 11:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-03-27 20:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-04-18 20:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-04-23 20:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-04-24 20:55:14" }
    ],
    schema: {
        data: function (data) {
            $.each(data, function (i, val) {
                val.dob = kendo.parseDate(val.dob, "yyyy-MM-dd HH:mm:ss");
            });
            return data;
        }
    }

我还将做一些额外的更改：


将
格式
定义包含在
日期时间选择器中
以匹配
网格中的格式
：

代码：


通过
Change
事件更改
blur
事件，使其仅在输入字段的值实际更改时被触发

代码：

您将
parse
函数放置在
网格
定义中，而不是
数据源
中。您还需要提供与接收的格式相匹配的格式（“yyyy-MM-dd HH:MM:ss”）。试试这个：

dataSource: {
    data  : [
        { FirstName: "Joe", LastName: "Smith", dob: "2013-02-18 19:54:13"},
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-18 20:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-18 21:56:15" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-18 22:57:16" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-19 20:55:20" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-24 20:56:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-26 20:57:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-02-28 20:42:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-03-22 11:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-03-27 20:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-04-18 20:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-04-23 20:55:14" },
        { FirstName: "Jane", LastName: "Smith", dob: "2013-04-24 20:55:14" }
    ],
    schema: {
        data: function (data) {
            $.each(data, function (i, val) {
                val.dob = kendo.parseDate(val.dob, "yyyy-MM-dd HH:mm:ss");
            });
            return data;
        }
    }

我还将做一些额外的更改：


将
格式
定义包含在
日期时间选择器中
以匹配
网格中的格式
：

代码：


通过
Change
事件更改
blur
事件，使其仅在输入字段的值实际更改时被触发

代码：

感谢您的快速回复，但当我在服务中使用此数据时，它无法正常工作var db=new kendo.data.DataSource（{transport:{read:{url:，dataType:{json}}，schema:{data:function（transport）{$.each（transport，function（i，val）{val.time=kendo.parseDate（val.time，“yyyy-MM-dd HH:MM:ss”）；}）；return transport；}，model:{fields:{time:{type:“date”}}}，是否对上述文本使用了剪切和粘贴？如果是，请查看语法，特别是开-关方括号（{}）和使用“；”在JSON definitions.ya中，我复制了这里，但在我的应用程序中，语法格式正确，但这里的格式不正确…我们怎么办？在JSFIDLE/JSBin中发布它怎么样？您的浏览器是否进行了调试？尝试检查它实际发布了什么（如果有）？还检查浏览器实际如何接收页面（检查HTML/JavaScript）以防服务不正确。感谢您的快速回复，但当我使用此服务内数据时，它无法正常工作var db=new kendo.data.DataSource（{transport:{read:{url:，数据类型：“json”}，模式：{data:function（transport）{$.each（transport，function（i，val）{val.time=kendo.parseDate（val.time，“yyyy-MM-dd HH:MM:ss”）；}）；返回传输；}，模型：{fields:{time:{type:{date date}}，您是否对上述文本使用了剪切和粘贴？如果是，请查看语法，特别是开-关花括号（{}）和“；“在JSON definitions.ya中，我复制了这里，但在我的应用程序中，语法格式正确，但这里的格式不正确……我们该怎么办？在JSFIDLE/JSBin中发布它怎么样？您的浏览器是否进行了调试？尝试检查它实际发布了什么（如果有）？还检查浏览器实际接收页面的方式（检查HTML/JavaScript）以防服务不正确。
$("#datetimepicker, #datetimepicker1").on("change", function () {
    var mindate = $('#datetimepicker').data("kendoDateTimePicker").value();
    var maxdate = $('#datetimepicker1').data("kendoDateTimePicker").value();
    var condition = {
        logic  : "and",
        filters: [
        ]
    };
    if (mindate !== null) {
        condition.filters.push({ field: "dob", operator: "ge", value: mindate });
    }
    if (maxdate !== null) {
        condition.filters.push({ field: "dob", operator: "le", value: maxdate });
    }
    result.dataSource.filter(condition);
});