剑道 - 通过页面上的代码保存网格过滤器仅存在日期过滤器网格列的问题

Posted 2023-05-07

【中文标题】剑道 - 通过页面上的代码保存网格过滤器仅存在日期过滤器网格列的问题

【英文标题】：Kendo - save grid filters via code on the page has issues only with the date filter grid columns

【发布时间】：2013-01-19 19:21:25

【问题描述】：

我的网页上有一个剑道网格，我正在尝试使用 sessionStorage 以编程方式保存网格过滤器，这在大多数情况下都有效。

我遇到的问题是，当我在日期列上放置过滤器时，当我尝试在用户导航回该页面时重新应用该过滤器时，它会在其中一个匿名函数 b/c 中出错toLowerCase() 方法不存在。如果我在字符串列上过滤，过滤器工作正常。我可以应用多个过滤器并将它们保存到sessionStorage var 并重新应用到网格就好了。只有日期列才有问题。

我花了一段时间才弄清楚如何使用以下语法获取剑道网格过滤器：

var theKgridFilters = $("#gridList").data("kendoGrid").dataSource.filter();

然后要将其存储在 sessionStorage var 中，我必须 stringify() 对象，否则它不会在该 var 中保存网格过滤器：

sessionStorage.setItem('theGridFilters', JSON.stringify(theKgridFilters));

接下来，要在网格上重新应用过滤器，我必须将字符串转换回 JSON 对象 b/c 过滤器是具有属性的对象，所以我使用了这个：

if (sessionStorage.theGridFilters)                             
    gridFilter = sessionStorage.theGridFilters;
    gridFilter = $.parseJSON(gridFilter);

应用于网格数据源过滤器属性：

filter: gridFilter, 

当我在日期列上过滤网格时，下面这一行会出现错误：

function anonymous(d, __f, __o) 
    return (d.Last_Modified_Date.toLowerCase() == '2013-01-25t06:00:00.000z')

具有过滤器的字段是Last_Modified_Date。我对使用 jQuery、JS 等还是很陌生，根据我的阅读，anonymous() fns 是动态创建的，所以我不相信我可以改变它。

我在网上查了一下，有人提到要在toLowerCase() 之前添加toString() 函数。我在调试器中尝试过它并且它有效，但我不确定如何通过代码访问它以进行更改。貌似匿名函数是根据IE调试器的调用栈从kendo.web.js文件中调用的。

另外，调试器中日期字段的值如下所示：

d.Last_Modified_Date    Wed Jan 25 00:00:00 CST 2013    Object, (Date)

所以我什至不确定它是否可以将该值等同于上面匿名 fn 中的字符串，即：'2013-01-25t06:00:00.000z'。

如果有人对解决此日期过滤器保存问题有任何见解，请告诉我。它快把我逼疯了。也许还有另一种我不知道的保存网格过滤器的方法。

提前致谢， 布鲁斯！

【问题讨论】：

schema.model 中的 Last_Modified_Date 是如何定义的？您是否明确将其定义为date？

嗨 OnaBai，是的，它被定义为日期：Last_Modified_Date: type: "date", editable: false ,

感谢您也给了我使用 sessionStorage 的想法。

【参考方案1】：

您观察到这种行为的原因是 JSON.parse 不创建 javascript Date 对象。它改为创建字符串：

typeof $.parseJSON(JSON.stringify(new Date())); // "string"

Kendo UI 框架然后尝试将日期过滤为字符串，从而导致错误。

解决方法是使用指定reviver：

 function dateReviver(key, value) 
    var a;
    if (typeof value === 'string') 
        a = /^(\d4)-(\d2)-(\d2)T(\d2):(\d2):(\d2(?:\.\d*)?)Z$/.exec(value);
        if (a) 
            return new Date(Date.UTC(+a[1], +a[2] - 1, +a[3], +a[4],
                            +a[5], +a[6]));
        
    
    return value;
 

 gridFilter = JSON.parse(gridFilter, dateReviver);

【讨论】：

哇，非常感谢阿塔纳斯·科尔切夫！！！我永远不会想到这一点。在此之前从未听说过 reviver fn，所以我需要确定一下。此外，在您上面提供的代码中，如果我将 JSON.parse 替换为 $.parseJSON()，它会因相同的错误而出错，但使用 JSON.parse 就可以了。我想我看到 $.parseJSON() 调用 JSON.parse，但无论如何，我很高兴我让它工作。我花了大约 2 天的时间试图弄清楚。再次感谢，非常感谢！

好的，我读了一点，现在得到 JSON.parse() 方法的 reviver fn。它有助于传输您的数据。 JSON.parse() 方法只有可选的 reviver 参数，$.parseJSON() 方法没有，这就是它不能与 $.parseJSON() 一起使用的原因。 msdn.microsoft.com/en-us/library/ie/cc836466(v=vs.94).aspx