Ext 三 grouped grid中自定义grouping header

? ?在ext 3中自带API中，使用record中的某个或者某些字段组成grouping header是比较方便的。但是，如果希望使用这些record按照某个方法计算出来一个grouping header，好像就没有什么好办法了。

? ?经过一些搜索，找到了一个解决方案，在此mark下。

? ? this.buildHeaderTempalte = function() {

		return new Ext.XTemplate(
				'<div id="{groupId}" class="x-grid-group {cls}">',
				'<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div class="x-grid-group-title">',
				' {[this.buildHeaderForGroupingRecords(values)]}',
				'</div></div>',
				'<div id="{groupId}-bd" class="x-grid-group-body">', {
					buildHeaderForGroupingRecords : function(values) {
						var suppHelper = com.oocl.ir4.sps.web.js.cache.SupportingDataHelper;
						var isOfficeVarious = false;
						var isPlanStatusVarious = false;
						var legSeq = "";
						var legTransmode = "";
						var ctrlOffice = "";
						var planStatus = "";
						var header = "";
						if (values && values.rs && values.rs.length
								&& values.rs.length > 0) {
							for (var i = 0; i < values.rs.length; i++) {
								var record = values.rs[i];
								if (i === 0) {
									legSeq = record.get('legSeq');
									if (!Ext
											.isEmpty(record.get('legTransMode')))
										legTransmode = suppHelper
												.getSupportingDataNameById(
														com.oocl.ir4.sps.web.cache.support.TransModeStore,
														record
																.get('legTransMode'));
									ctrlOffice = suppHelper
											.getSupportingDataNameById(
													com.oocl.ir4.sps.web.cache.profile.OfficeStore,
													record.get('legCtrlOffice'));
									planStatus = suppHelper
											.getSupportingDataNameById(
													com.oocl.ir4.sps.web.cache.support.OrderPlanStatusStore,
													record.get('legPlanStatus'));
								}

								isOfficeVarious = isOfficeVarious
										|| record.get("isCtrlOfficeVarious");
								isPlanStatusVarious = isPlanStatusVarious
										|| record.get("isPlanStatusVarious");

							}

						}
						if (isOfficeVarious)
							ctrlOffice = TpConstants.VARIOUS_VALUE;
						if (isPlanStatusVarious)
							planStatus = TpConstants.VARIOUS_VALUE;

						header = legSeq + "-" + legTransmode + "-" + ctrlOffice
								+ "-" + planStatus;
						return header;

					}
				});
	};

?使用的时候：

					view : new Ext.grid.GroupingView({
								forceFit : true,
								disableGroupingByClick : true,
								startGroup : new TpGroupedHeader()
										.buildHeaderTempalte()
							}),