Question

我正在使用来自Telerik的kendo网格并遇到问题。我想使用日期过滤器过滤数据服务器端。所以我找到了一个正在运行的例子，它按照我的预期工作：

<div id="grid"></div>
<script>
$(document).ready(function () {
    $("#grid").kendoGrid({
        dataSource: {
            type: "odata",
            transport: {
                read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
            },
            schema: {
                model: {
                    fields: {
                        OrderDate: { type: "date" }
                    }
                }
            },
            pageSize: 20,
            serverPaging: true,
            serverFiltering: true,
            serverSorting: true
        },
        height: 550,
        filterable: true,
        sortable: true,
        pageable: true,
        columns: [
          {
              field: "OrderDate",
              title: "Order Date",
              format: "{0:MMM dd, yyyy}",
              parseFormats: "{0:MM/dd/yyyy}",
              headerTemplate: '<label for="check-all"><b>Start Date</b></label>',
              headerAttributes: { style: "text-align: center;" },
              attributes: { style: "text-align:center !important;padding-right: 25px;" },
              filterable: {
                  ui: function (element) {
                      element.kendoDatePicker({
                          format: "MMM dd, yyyy"
                      });
                  }
              }
          }
        ]
    });
});

现在我根据自己的需要改变了这个例子。我正在使用返回JSON数据的REST API调用。数据显示在网格中，但是当我尝试使用过滤器时，数据会丢失。似乎日期格式有问题，但我不知道什么是正确的方法。这是我的代码：

<div id="grid"></div>
<script>
$(document).ready(function () {
    $("#grid").kendoGrid({
        dataSource: {
            transport: {
                read: {
                    url: "http://localhost/FPT2015.WebApp/api/BereitschaftszeitStammdaten",
                    dataType: "json"
                }
            },
            schema: {
                data: "d.results",
                model: {
                    fields: {
                        stundeVon: { type: "date" }
                    }
                }
                , parse: function (data) {
                    $.each(data.d.results, function (i, val) {
                        val.stundeVon = new Date(val.stundeVon);
                    });
                    return data;
                }
            },
            pageSize: 20,
            serverPaging: true,
            serverFiltering: true,
            serverSorting: true
        },
        height: 550,
        filterable: true,
        sortable: true,
        pageable: true,
        columns: [
          {
              field: "stundeVon",
              title: "Order Date",
              format: "{0:MMM dd, yyyy}",
              parseFormats: "{0:MM/dd/yyyy}",
              headerTemplate: '<label for="check-all"><b>Start Date</b></label>',
              headerAttributes: { style: "text-align: center;" },
              attributes: { style: "text-align:center !important;padding-right: 25px;" },
              filterable: {
                  ui: function (element) {
                      element.kendoDatePicker({
                          format: "MMM dd, yyyy"
                      });
                  }
              }
          }
        ]
    });
});

这是我的API返回的JSON：

{
    "d":{
        "__count":6,
        "results":[
            {
                "bereitschaftszeitId":2,
                "bereitschaftlerId":1,
                "stundeVon":"2015-11-25T06:00:00+01:00",
                "stundeBis":"2015-12-07T07:00:00+01:00"
            },
            {
                "bereitschaftszeitId":5,
                "bereitschaftlerId":2,
                "stundeVon":"2015-12-07T06:00:00+01:00",
                "stundeBis":"2015-12-14T06:00:00+01:00"
            },
            {
                "bereitschaftszeitId":7,
                "bereitschaftlerId":1,
                "stundeVon":"2016-01-10T10:00:00+01:00",
                "stundeBis":"2016-01-17T10:00:00+01:00"
            },
            {
                "bereitschaftszeitId":12,
                "bereitschaftlerId":13,
                "stundeVon":"2016-01-03T10:00:00+01:00",
                "stundeBis":"2016-01-10T10:00:00+01:00"
            },
            {
                "bereitschaftszeitId":15,
                "bereitschaftlerId":2,
                "stundeVon":"2016-01-18T06:00:00+01:00",
                "stundeBis":"2016-02-19T06:00:00+01:00"
            },
            {
                "bereitschaftszeitId":44,
                "bereitschaftlerId":2,
                "stundeVon":"2016-03-11T12:06:21.207+01:00",
                "stundeBis":"2017-03-11T00:06:00+01:00"
            }
        ]
    }
}

有人看到我在这里做错了什么吗？如果你能帮助我，我会很高兴的。

Answer 1

我为您制作了一个简单的道场，希望看到预期的结果： http://dojo.telerik.com/eXEFO

我所做的就是将日期解析元素调整为：

 val.stundeVon = new Date(val.stundeVon);
 val.stundeVon.setHours(0,0,0,0);

当您比较日期时，它将进行exact匹配，这意味着如果您没有在过滤中提供时间元素，那么系统将根据日期匹配日期dd MMM yyyy HH：mm：ss ，在过滤中，它将应用日期元素，但始终提供00:00:00作为时间部分。

所以我所做的就是强制将时间部分设置为默认的00:00:00，然后过滤按预期工作。

如果这不是预期的行为且时间元素很重要，那么将过滤器控件更改为日期时间选择器，然后这也应该传递时间部分。

注意：我已将过滤，分页等更改为客户端，以便此示例正常工作

任何问题都会让我大呼过瘾。

Answer 2

这里的问题是我的服务器端代码（C＃）。过滤器逻辑已正确传递给服务器，但我有一个Linq DynamicQuery无法处理Where-String，如：

Where(@"StundeVon == ""Tue Mar 08 2016 00:00:00 GMT+0100 (Mitteleuropäische Zeit)""")

我更新了表达式，使用参数，现在可以使用了。它看起来像这样：

Where(@"StundeVon == @0", new DateTime(2016,3,8))

感谢大卫的帮助。它让我走上正轨。时间部分也是一件事： - ）

Kendo Grid Date Filter不能使用我的JSON数据

2 个答案: