-<html>
-<head>
- <title>The source code</title>
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
-</head>
-<body onload="prettyPrint();">
- <pre class="prettyprint lang-js">/*!
- * Ext JS Library 3.0.3
- * Copyright(c) 2006-2009 Ext JS, LLC
- * licensing@extjs.com
- * http://www.extjs.com/license
- */
-<div id="cls-Ext.grid.GroupingView"></div>/**\r
+<html>\r
+<head>\r
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> \r
+ <title>The source code</title>\r
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
+</head>\r
+<body onload="prettyPrint();">\r
+ <pre class="prettyprint lang-js"><div id="cls-Ext.grid.GroupingView"></div>/**\r
* @class Ext.grid.GroupingView\r
* @extends Ext.grid.GridView\r
* Adds the ability for single level grouping to the grid. A {@link Ext.data.GroupingStore GroupingStore}\r
* </code></pre>\r
*/\r
groupTextTpl : '{text}',\r
- \r
+\r
<div id="cfg-Ext.grid.GroupingView-groupMode"></div>/**\r
* @cfg {String} groupMode Indicates how to construct the group identifier. <tt>'value'</tt> constructs the id using\r
* raw value, <tt>'display'</tt> constructs the id using the rendered value. Defaults to <tt>'value'</tt>.\r
*/\r
groupMode: 'value',\r
- \r
+\r
<div id="cfg-Ext.grid.GroupingView-groupRenderer"></div>/**\r
* @cfg {Function} groupRenderer This property must be configured in the {@link Ext.grid.Column} for\r
* each column.\r
);\r
}\r
this.startGroup.compile();\r
+ if(!this.endGroup){\r
+ this.endGroup = '</div></div>';\r
+ }\r
+\r
this.endGroup = '</div></div>';\r
},\r
\r
\r
// private\r
onAdd : function(){\r
- if(this.enableGrouping && !this.ignoreAdd){\r
+ if(this.canGroup() && !this.ignoreAdd){\r
var ss = this.getScrollState();\r
this.refresh();\r
this.restoreScroll(ss);\r
- }else if(!this.enableGrouping){\r
+ }else if(!this.canGroup()){\r
Ext.grid.GroupingView.superclass.onAdd.apply(this, arguments);\r
}\r
},\r
}\r
if((item = items.get('showGroups'))){\r
item.setDisabled(disabled);\r
- item.setChecked(!!this.getGroupField(), true);\r
+ item.setChecked(this.enableGrouping, true);\r
}\r
},\r
\r
}\r
},\r
\r
+ processEvent: function(name, e){\r
+ var hd = e.getTarget('.x-grid-group-hd', this.mainBody);\r
+ if(hd){\r
+ // group value is at the end of the string\r
+ var field = this.getGroupField(),\r
+ prefix = this.getPrefix(field),\r
+ groupValue = hd.id.substring(prefix.length);\r
+\r
+ // remove trailing '-hd'\r
+ groupValue = groupValue.substr(0, groupValue.length - 3);\r
+ if(groupValue){\r
+ this.grid.fireEvent('group' + name, this.grid, field, groupValue, e);\r
+ }\r
+ }\r
+\r
+ },\r
+\r
// private\r
onGroupByClick : function(){\r
+ this.enableGrouping = true;\r
this.grid.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));\r
+ this.grid.fireEvent('groupchange', this, this.grid.store.getGroupState());\r
this.beforeMenuShow(); // Make sure the checkboxes get properly set when changing groups\r
+ this.refresh();\r
},\r
\r
// private\r
onShowGroupsClick : function(mi, checked){\r
+ this.enableGrouping = checked;\r
if(checked){\r
this.onGroupByClick();\r
}else{\r
this.grid.store.clearGrouping();\r
+ this.grid.fireEvent('groupchange', this, null);\r
+ }\r
+ },\r
+\r
+ <div id="method-Ext.grid.GroupingView-toggleRowIndex"></div>/**\r
+ * Toggle the group that contains the specific row.\r
+ * @param {Number} rowIndex The row inside the group\r
+ * @param {Boolean} expanded (optional)\r
+ */\r
+ toggleRowIndex : function(rowIndex, expanded){\r
+ if(!this.canGroup()){\r
+ return;\r
+ }\r
+ var row = this.getRow(rowIndex);\r
+ if(row){\r
+ this.toggleGroup(this.findGroup(row), expanded);\r
}\r
},\r
\r
* @param {Boolean} expanded (optional)\r
*/\r
toggleGroup : function(group, expanded){\r
- this.grid.stopEditing(true);\r
- group = Ext.getDom(group);\r
- var gel = Ext.fly(group);\r
- expanded = expanded !== undefined ?\r
- expanded : gel.hasClass('x-grid-group-collapsed');\r
-\r
- this.state[gel.dom.id] = expanded;\r
- gel[expanded ? 'removeClass' : 'addClass']('x-grid-group-collapsed');\r
+ var gel = Ext.get(group);\r
+ expanded = Ext.isDefined(expanded) ? expanded : gel.hasClass('x-grid-group-collapsed');\r
+ if(this.state[gel.id] !== expanded){\r
+ this.grid.stopEditing(true);\r
+ this.state[gel.id] = expanded;\r
+ gel[expanded ? 'removeClass' : 'addClass']('x-grid-group-collapsed');\r
+ }\r
},\r
\r
<div id="method-Ext.grid.GroupingView-toggleAllGroups"></div>/**\r
getGroupField : function(){\r
return this.grid.store.getGroupState();\r
},\r
- \r
+\r
// private\r
afterRender : function(){\r
+ if(!this.ds || !this.cm){\r
+ return;\r
+ }\r
Ext.grid.GroupingView.superclass.afterRender.call(this);\r
if(this.grid.deferRowRender){\r
this.updateGroupWidths();\r
var eg = !!groupField;\r
// if they turned off grouping and the last grouped field is hidden\r
if(this.hideGroupedColumn) {\r
- var colIndex = this.cm.findColumnIndex(groupField);\r
- if(!eg && this.lastGroupField !== undefined) {\r
+ var colIndex = this.cm.findColumnIndex(groupField),\r
+ hasLastGroupField = Ext.isDefined(this.lastGroupField);\r
+ if(!eg && hasLastGroupField){\r
this.mainBody.update('');\r
this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField), false);\r
delete this.lastGroupField;\r
- }else if (eg && this.lastGroupField === undefined) {\r
+ }else if (eg && !hasLastGroupField){\r
this.lastGroupField = groupField;\r
this.cm.setHidden(colIndex, true);\r
- }else if (eg && this.lastGroupField !== undefined && groupField !== this.lastGroupField) {\r
+ }else if (eg && hasLastGroupField && groupField !== this.lastGroupField) {\r
this.mainBody.update('');\r
var oldIndex = this.cm.findColumnIndex(this.lastGroupField);\r
this.cm.setHidden(oldIndex, false);\r
if(rs.length < 1){\r
return '';\r
}\r
- var groupField = this.getGroupField(),\r
- colIndex = this.cm.findColumnIndex(groupField),\r
- g;\r
-\r
- this.enableGrouping = !!groupField;\r
\r
- if(!this.enableGrouping || this.isUpdating){\r
+ if(!this.canGroup() || this.isUpdating){\r
return Ext.grid.GroupingView.superclass.doRender.apply(\r
this, arguments);\r
}\r
- var gstyle = 'width:' + this.getTotalWidth() + ';',\r
- gidPrefix = this.grid.getGridEl().id,\r
+\r
+ var groupField = this.getGroupField(),\r
+ colIndex = this.cm.findColumnIndex(groupField),\r
+ g,\r
+ gstyle = 'width:' + this.getTotalWidth() + ';',\r
cfg = this.cm.config[colIndex],\r
groupRenderer = cfg.groupRenderer || cfg.renderer,\r
prefix = this.showGroupName ? (cfg.groupName || cfg.header)+': ' : '',\r
var rowIndex = startRow + i,\r
r = rs[i],\r
gvalue = r.data[groupField];\r
- \r
+\r
g = this.getGroup(gvalue, r, groupRenderer, rowIndex, colIndex, ds);\r
if(!curGroup || curGroup.group != g){\r
- gid = this.constructId(gvalue, gidPrefix, groupField, colIndex);\r
- // if state is defined use it, however state is in terms of expanded\r
- // so negate it, otherwise use the default.\r
- var isCollapsed = typeof this.state[gid] !== 'undefined' ? !this.state[gid] : this.startCollapsed;\r
- var gcls = isCollapsed ? 'x-grid-group-collapsed' : ''; \r
+ gid = this.constructId(gvalue, groupField, colIndex);\r
+ // if state is defined use it, however state is in terms of expanded\r
+ // so negate it, otherwise use the default.\r
+ this.state[gid] = !(Ext.isDefined(this.state[gid]) ? !this.state[gid] : this.startCollapsed);\r
curGroup = {\r
group: g,\r
gvalue: gvalue,\r
groupId: gid,\r
startRow: rowIndex,\r
rs: [r],\r
- cls: gcls,\r
+ cls: this.state[gid] ? '' : 'x-grid-group-collapsed',\r
style: gstyle\r
};\r
groups.push(curGroup);\r
*/\r
getGroupId : function(value){\r
var field = this.getGroupField();\r
- return this.constructId(value, this.grid.getGridEl().id, field, this.cm.findColumnIndex(field));\r
+ return this.constructId(value, field, this.cm.findColumnIndex(field));\r
},\r
- \r
+\r
// private\r
- constructId : function(value, prefix, field, idx){\r
+ constructId : function(value, field, idx){\r
var cfg = this.cm.config[idx],\r
groupRenderer = cfg.groupRenderer || cfg.renderer,\r
val = (this.groupMode == 'value') ? value : this.getGroup(value, {data:{}}, groupRenderer, 0, idx, this.ds);\r
- \r
- return prefix + '-gp-' + field + '-' + Ext.util.Format.htmlEncode(val);\r
+\r
+ return this.getPrefix(field) + Ext.util.Format.htmlEncode(val);\r
+ },\r
+\r
+ // private\r
+ canGroup : function(){\r
+ return this.enableGrouping && !!this.getGroupField();\r
+ },\r
+\r
+ // private\r
+ getPrefix: function(field){\r
+ return this.grid.getGridEl().id + '-gp-' + field + '-';\r
},\r
\r
// private\r
\r
// private\r
getRows : function(){\r
- if(!this.enableGrouping){\r
+ if(!this.canGroup()){\r
return Ext.grid.GroupingView.superclass.getRows.call(this);\r
}\r
var r = [];\r
\r
// private\r
updateGroupWidths : function(){\r
- if(!this.enableGrouping || !this.hasRows()){\r
+ if(!this.canGroup() || !this.hasRows()){\r
return;\r
}\r
var tw = Math.max(this.cm.getTotalWidth(), this.el.dom.offsetWidth-this.getScrollOffset()) +'px';\r
\r
// private\r
onBeforeRowSelect : function(sm, rowIndex){\r
- if(!this.enableGrouping){\r
- return;\r
- }\r
- var row = this.getRow(rowIndex);\r
- if(row && !row.offsetParent){\r
- var g = this.findGroup(row);\r
- this.toggleGroup(g, true);\r
- }\r
+ this.toggleRowIndex(rowIndex, true);\r
}\r
});\r
// private\r
-Ext.grid.GroupingView.GROUP_ID = 1000;</pre>
-</body>
+Ext.grid.GroupingView.GROUP_ID = 1000;</pre> \r
+</body>\r
</html>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff