使用日期选择器仅在日期过滤jqGrid日期时间列

Question

我目前有一个问题，我在格式化为只显示该字段的日期部分的网格中的日期时间列。因此，原始数据看起来像“2015-04-15T15：31：49.357”，网格列看起来像“2015年4月15日”。

我正在使用日期选择器来支持列过滤，并希望能够使用“eq”运算符来筛选使用“等于”，但仅在日期部分。目前我没有得到任何比赛，因为时间已经到了。

有可能解决这个问题吗？我知道我可以操纵原始数据来剥离日期的时间部分，但我更愿意将这些信息保留在原始数据中，因为我也支持导出为Excel，并且可能需要时间。

我对列电流选项有：

  formatter = "date"; 
      formatoptions = {srcformat: "Y-m-d", newformat: "n/j/Y"}; 

我尝试了各种方案，但到目前为止还没有任何运气。

我也在使用free-jqgrid分叉。从OlegKi在github上

Answer 1

响应：https://github.com/free-jqgrid/jqGrid/issues/50

我在*的jqGrid以方便引入自定义过滤功能实现像青年的方案。答案提供了这样的实现的例子。

在你的情况下，你可以定义新日期只是短名称“deq”下的比较操作，比较操作日期仅在短名称dne下“不等于”。 customSortOperations选项的代码可能是以下几点：

customSortOperations: { 
deq: { 
    operand: "==", 
    text: "Date only \"equal\"", 
    filter: function (options) { 
     var p = this.p, iCol = p.iColByName[options.cmName], cm = p.colModel[iCol], 
      newformat = cm.formatoptions != null && cm.formatoptions.newformat ? 
        cm.formatoptions.newformat : 
        $(this).jqGrid("getGridRes", "formatter.date.newformat"), 
      srcformat = cm.formatoptions != null && cm.formatoptions.srcformat ? 
        cm.formatoptions.srcformat : 
        $(this).jqGrid("getGridRes", "formatter.date.srcformat"), 
      fieldData = $.jgrid.parseDate.call(this, srcformat, options.item[options.cmName]), 
      searchValue = $.jgrid.parseDate.call(this, newformat, options.searchValue); 
     return fieldData.getFullYear() === searchValue.getFullYear() && 
      fieldData.getMonth() === searchValue.getMonth() && 
      fieldData.getDate() === searchValue.getDate(); 
    } 
}, 
dne: { 
    operand: "!=", 
    text: "Date only \"not equal\"", 
    filter: function (options) { 
     var p = this.p, iCol = p.iColByName[options.cmName], cm = p.colModel[iCol], 
      newformat = cm.formatoptions != null && cm.formatoptions.newformat ? 
        cm.formatoptions.newformat : 
        $(this).jqGrid("getGridRes", "formatter.date.newformat"), 
      srcformat = cm.formatoptions != null && cm.formatoptions.srcformat ? 
        cm.formatoptions.srcformat : 
        $(this).jqGrid("getGridRes", "formatter.date.srcformat"), 
      fieldData = $.jgrid.parseDate.call(this, srcformat, options.item[options.cmName]), 
      searchValue = $.jgrid.parseDate.call(this, newformat, options.searchValue); 
     return fieldData.getFullYear() !== searchValue.getFullYear() || 
      fieldData.getMonth() !== searchValue.getMonth() || 
      fieldData.getDate() !== searchValue.getDate(); 
    } 
} 

} 为了能够使用新的“DEQ”和“DNE”的操作，您应该包括有与日柱的searchoptions的SOPT。

该演示使用上述代码。输入数据包含3个日期：“2015-04-15T15：31：49.357”，“2015-04-15T21：15：40.123”，“2015-04-15”。截至2015年4月15日的过滤显示所有三行。

另一个演示使用几乎相同的代码，但以全日期/时间格式显示日期。尽管如此，过滤工作。请小心，我在演示中使用来自GitHub的最新免费jqGrid源代码。这真的很有必要，因为我在parseDate的代码中做了一些小的改动来使演示工作。

Answer 2

我在免费的jqGrid中引入了custom filtering功能，可以轻松实现像青春这样的场景。 The answer提供了这种实现的例子。

在你的情况下，可以定义新的Date only "equal"比较下，例如短名称"deq"操作下简称dne比较操作Date only "not equal"。的customSortOperations选项的代码可能是以下几点：

customSortOperations: { 
    deq: { 
     operand: "==", 
     text: "Date only \"equal\"", 
     filter: function (options) { 
      var p = this.p, iCol = p.iColByName[options.cmName], cm = p.colModel[iCol], 
       newformat = cm.formatoptions != null && cm.formatoptions.newformat ? 
         cm.formatoptions.newformat : 
         $(this).jqGrid("getGridRes", "formatter.date.newformat"), 
       srcformat = cm.formatoptions != null && cm.formatoptions.srcformat ? 
         cm.formatoptions.srcformat : 
         $(this).jqGrid("getGridRes", "formatter.date.srcformat"), 
       fieldData = $.jgrid.parseDate.call(this, srcformat, options.item[options.cmName]), 
       searchValue = $.jgrid.parseDate.call(this, newformat, options.searchValue); 
      return fieldData.getFullYear() === searchValue.getFullYear() && 
       fieldData.getMonth() === searchValue.getMonth() && 
       fieldData.getDate() === searchValue.getDate(); 
     } 
    }, 
    dne: { 
     operand: "!=", 
     text: "Date only \"not equal\"", 
     filter: function (options) { 
      var p = this.p, iCol = p.iColByName[options.cmName], cm = p.colModel[iCol], 
       newformat = cm.formatoptions != null && cm.formatoptions.newformat ? 
         cm.formatoptions.newformat : 
         $(this).jqGrid("getGridRes", "formatter.date.newformat"), 
       srcformat = cm.formatoptions != null && cm.formatoptions.srcformat ? 
         cm.formatoptions.srcformat : 
         $(this).jqGrid("getGridRes", "formatter.date.srcformat"), 
       fieldData = $.jgrid.parseDate.call(this, srcformat, options.item[options.cmName]), 
       searchValue = $.jgrid.parseDate.call(this, newformat, options.searchValue); 
      return fieldData.getFullYear() !== searchValue.getFullYear() || 
       fieldData.getMonth() !== searchValue.getMonth() || 
       fieldData.getDate() !== searchValue.getDate(); 
     } 
    } 
} 

为了能够在与日柱searchoptionssopt使用新"deq"和"dne"操作应该包括在那里。

The demo使用上面的代码。输入数据包含3个日期："2015-04-15T15:31:49.357"，"2015-04-15T21:15:40.123"，"2015-04-15"：

var mydata = [ 
     { id: "10", invdate: "2015-04-15T15:31:49.357", name: "test1",... }, 
     { id: "20", invdate: "2015-04-15T21:15:40.123", name: "test2",... }, 
     { id: "30", invdate: "2015-04-15", name: "test3", ...}, 
     ... 
    ] 

通过15-Apr-2015显示的过滤所有的三排：

Another demo使用几乎相同的代码，但显示日期以全日期/时间格式。尽管如此，过滤工作。请小心，我在演示中使用来自GitHub的最新免费jqGrid源代码。这真的很有必要，因为我在parseDate的代码中编写了一些small changes以使演示工作。