Ext JS GroupingStore组日期时间列由日期？

订单列表中有一个分机GroupingStore。其中一列是DateTime。我希望用户能够按日期时间列进行分组，并将所有日子都归入一组。目前，每个日期，小时，分钟和秒是一个组......不是非常有用:-)Ext JS GroupingStore组日期时间列由日期？

任何方式短两列来完成这个？

来源

2009-08-04 Josh

@Kevin韦尔 - 谢谢！出于某种原因，我不知道有一个extjs标签。可能很累:-) – Josh 2009-08-05 00:31:09

可以修改GroupingView的方法来做到这一点。

首先创建GroupingView对象：

var gview = new Ext.grid.GroupingView({ 
     forceFit: true, 
     groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})' 
    });

然后修改（事实上 “私人”）的方法：

gview.getGroup = function(v, r, groupRenderer, rowIndex, colIndex, ds){ 
    // colIndex of your date column 
if (colIndex == 2) { 
      // group only by date 
    return v.format('m.d.Y'); 
} 
    else { 
// default grouping 
    var g = groupRenderer ? groupRenderer(v, {}, r, rowIndex, colIndex, ds) : String(v); 
    if(g === ''){ 
     g = this.cm.config[colIndex].emptyGroupText || this.emptyGroupText; 
    } 
    return g; 
    } 
};

然后在视图应用到网格：

var grid = new Ext.grid.GridPanel({ 
... 
view: gview, 
... 
});

好啊，一点概念验证（点击“最后更新”排序）

Demo

来源

2009-08-05 01:02:11 Tarnschaf

太棒了，那很完美！ – Josh 2009-08-05 01:31:05

我修改了一下，看到我自己的答案。你得到了点，因为我真的只是清理你的代码 - 逻辑/方法是你的。再次感谢！ – Josh 2009-08-05 16:41:13

您是否确实需要参考日期的时间部分？如果不是，则可以在该字段上使用convert函数来调用date对象的clearTime（）。

来源

2009-08-05 00:44:16

在分组中，我不需要引用它，但列仍然需要显示它。 Tarnschaf击中了头部。按天分组，但仍在列中显示时间。 – Josh 2009-08-05 16:43:10

我想你可以指定日期格式，当你定义商店的记录类型。它可以解决你的问题。

喜欢的东西

var reader = new Ext.data.JsonReader(
    fields:[{ 
     type: 'date', 
     dateformat: 'd M Y' 
    },{ 
     ............. 
     .............. 
    }, 
    ............. 
    ............. 
    ] 
) 

var store = new Ext.data.Store({ 
    reader: reader, 
    data: [] 
})

来源

2009-08-05 00:55:54

我甚至没有尝试过 - 它可能工作。我看到了另一个答案，并立即知道这是我正在寻找的。 – Josh 2009-08-05 16:42:21

Tarnschaf的回答是正确的，我只是想我会发布我的最终修改版本的完整代码。这就是我最终做到的。谢谢Tarnschaf！

g.view.getGroup = g.view.getGroup.wrap(function(normal,v, r, groupRenderer, rowIndex, colIndex, ds) 
{ 
    var cm = g.getColumnModel(); 
    var id=cm.getColumnId(colIndex); 
    var col=cm.getColumnById(id); 

    if(col.renderer == formatDateTime) 
    { 
     v = (new Date(v)).format('m/d/yy'); 
     groupRenderer = formatDate; 
    } 

    return normal(v, r, groupRenderer, rowIndex, colIndex, ds); 
});

其中g是GridView。我发现通过使用g.view.getGroup.wrap我可以保持前面的功能不变，只修改Tarnschaf答案所做的参数。此外，即使列被重新排序，这种方法也可以工作 - 没有硬编码的colIndex。此外，它自动适用于每个具有渲染器formatDateTime（我的日期/时间格式化函数）的列，并将其切换为formatDate groupRenderer所以小组标题看起来更干净。

来源

2009-08-05 16:40:24 Josh

-1

在网格列定义，定义一个groupRenderer配置：

{ 
    groupRenderer : function(v, u, r, row, col, store) {       
    return //your custom group value 
    } 
}

来源

2015-10-13 11:19:14 user5440533

Ext JS GroupingStore组日期时间列由日期？

回答

相关问题