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組日期時間列由日期？

回答

相關問題