/**
* @class Ext.grid.column.Action
* @extends Ext.grid.column.Column
* <p>A Grid header type which renders an icon, or a series of icons in a grid cell, and offers a scoped click
@@ -50,23 +67,22 @@
* });
* <p>The action column can be at any index in the columns array, and a grid can have any number of
* action columns. </p>
- * @xtype actioncolumn
*/
Ext.define('Ext.grid.column.Action', {
extend: 'Ext.grid.column.Column',
alias: ['widget.actioncolumn'],
alternateClassName: 'Ext.grid.ActionColumn',
- /**
+ /**
* @cfg {String} icon
* The URL of an image to display as the clickable element in the column.
* Optional - defaults to <code>{@link Ext#BLANK_IMAGE_URL Ext.BLANK_IMAGE_URL}</code>.
*/
- /**
+ /**
* @cfg {String} iconCls
* A CSS class to apply to the icon image. To determine the class dynamically, configure the Column with a <code>{@link #getClass}</code> function.
*/
- /**
+ /**
* @cfg {Function} handler A function called when the icon is clicked.
* The handler is passed the following parameters:<div class="mdetail-params"><ul>
* <li><code>view</code> : TableView<div class="sub-desc">The owning TableView.</div></li>
@@ -77,18 +93,18 @@ Ext.define('Ext.grid.column.Action', {
* <li><code>e</code> : Event<div class="sub-desc">The click event.</div></li>
* </ul></div>
*/
- /**
+ /**
* @cfg {Object} scope The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
* and <code>{@link #getClass}</code> fuctions are executed. Defaults to this Column.
*/
- /**
+ /**
* @cfg {String} tooltip A tooltip message to be displayed on hover. {@link Ext.tip.QuickTipManager#init Ext.tip.QuickTipManager} must have
* been initialized.
*/
- /**
+ /**
* @cfg {Boolean} stopSelection Defaults to <code>true</code>. Prevent grid <i>row</i> selection upon mousedown.
*/
- /**
+ /**
* @cfg {Function} getClass A function which returns the CSS class to apply to the icon image.
* The function is passed the following parameters:<ul>
* <li><b>v</b> : Object<p class="sub-desc">The value of the column's configured field (if any).</p></li>
@@ -103,7 +119,7 @@ Ext.define('Ext.grid.column.Action', {
* <li><b>store</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li>
* </ul>
*/
- /**
+ /**
* @cfg {Array} items An Array which may contain multiple icon definitions, each element of which may contain:
* <div class="mdetail-params"><ul>
* <li><code>icon</code> : String<div class="sub-desc">The url of an image to display as the clickable element
@@ -135,7 +151,7 @@ Ext.define('Ext.grid.column.Action', {
actionIdRe: /x-action-col-(\d+)/,
- /**
+ /**
* @cfg {String} altText The alt text to use for the image element. Defaults to <tt>''</tt>.
*/
altText: '',
@@ -152,7 +168,7 @@ Ext.define('Ext.grid.column.Action', {
// This is a Container. Delete the items config to be reinstated after construction.
delete cfg.items;
- this.callParent([cfg]);
+ me.callParent([cfg]);
// Items is an array property of ActionColumns
me.items = items;
@@ -166,7 +182,7 @@ Ext.define('Ext.grid.column.Action', {
meta.tdCls += ' ' + Ext.baseCSSPrefix + 'action-col-cell';
for (i = 0; i < l; i++) {
item = items[i];
- v += '<img alt="' + me.altText + '" src="' + (item.icon || Ext.BLANK_IMAGE_URL) +
+ v += '<img alt="' + (item.altText || me.altText) + '" src="' + (item.icon || Ext.BLANK_IMAGE_URL) +
'" class="' + Ext.baseCSSPrefix + 'action-col-icon ' + Ext.baseCSSPrefix + 'action-col-' + String(i) + ' ' + (item.iconCls || '') +
' ' + (Ext.isFunction(item.getClass) ? item.getClass.apply(item.scope||me.scope||me, arguments) : (me.iconCls || '')) + '"' +
((item.tooltip) ? ' data-qtip="' + item.tooltip + '"' : '') + ' />';
@@ -181,26 +197,30 @@ Ext.define('Ext.grid.column.Action', {
return this.callParent(arguments);
},
- /**
+ /**
* @private
* Process and refire events routed from the GridView's processEvent method.
* Also fires any configured click handlers. By default, cancels the mousedown event to prevent selection.
* Returns the event handler's status to allow canceling of GridView's bubbling process.
*/
processEvent : function(type, view, cell, recordIndex, cellIndex, e){
- var m = e.getTarget().className.match(this.actionIdRe),
+ var me = this,
+ match = e.getTarget().className.match(me.actionIdRe),
item, fn;
- if (m && (item = this.items[parseInt(m[1], 10)])) {
- if (type == 'click') {
- fn = item.handler;
- if (fn || this.handler) {
- fn.call(item.scope||this.scope||this, view, recordIndex, cellIndex, item, e);
+ if (match) {
+ item = me.items[parseInt(match[1], 10)];
+ if (item) {
+ if (type == 'click') {
+ fn = item.handler || me.handler;
+ if (fn) {
+ fn.call(item.scope || me.scope || me, view, recordIndex, cellIndex, item, e);
+ }
+ } else if (type == 'mousedown' && item.stopSelection !== false) {
+ return false;
}
- } else if ((type == 'mousedown') && (item.stopSelection !== false)) {
- return false;
}
}
- return this.callParent(arguments);
+ return me.callParent(arguments);
},
cascade: function(fn, scope) {
@@ -211,4 +231,6 @@ Ext.define('Ext.grid.column.Action', {
getRefItems: function() {
return [];
}
-});