ColumnActionColumn
| Package: | CQ.Ext.grid |
| Class: | ActionColumn |
| Extends: | CQ.Ext.grid.Column |
| Clientlib: | cq.widgets |
A Grid column type which renders an icon, or a series of icons in a grid cell, and offers a scoped click handler for each icon. Example usage:
new CQ.Ext.grid.GridPanel({
store: myStore,
columns: [
{
xtype: 'actioncolumn',
width: 50,
items: [
{
icon : 'sell.gif', // Use a URL in the icon config
tooltip: 'Sell stock',
handler: function(grid, rowIndex, colIndex) {
var rec = store.getAt(rowIndex);
alert("Sell " + rec.get('company'));
}
},
{
getClass: function(v, meta, rec) { // Or return a class from a function
if (rec.get('change') < 0) {
this.items[1].tooltip = 'Do not buy!';
return 'alert-col';
} else {
this.items[1].tooltip = 'Buy stock';
return 'buy-col';
}
},
handler: function(grid, rowIndex, colIndex) {
var rec = store.getAt(rowIndex);
alert("Buy " + rec.get('company'));
}
}
]
}
//any other columns here
]
});
The action column can be at any index in the columns array, and a grid can have any number of action columns.
| Config Options | Defined By | |
|---|---|---|
|
align : String
Optional. Set the CSS text-align property of the column. Defaults to undefined.
|
Column | |
|
altText : String The alt text to use for the image element. Defaults to ''.
The alt text to use for the image element. Defaults to ''.
|
ActionColumn | |
|
css : String Optional. An inline style definition string which is applied to all table cells in the column (excluding headers). De...
Optional. An inline style definition string which is applied to all table cells in the column (excluding headers). Defaults to undefined.
|
Column | |
|
dataIndex : String Required. The name of the field in the grid's CQ.Ext.data.Store's CQ.Ext.data.Record definition from which to draw th...
Required. The name of the field in the grid's CQ.Ext.data.Store's CQ.Ext.data.Record definition from which to draw the column's value. |
Column | |
|
editable : Boolean Optional. Defaults to true, enabling the configured editor. Set to false to initially disable editing on this column....
Optional. Defaults to true, enabling the configured editor. Set to false to initially disable editing on this column. The initial configuration may be dynamically altered using CQ.Ext.grid.ColumnModel.setEditable().
|
Column | |
|
editor : CQ.Ext.form.Field Optional. The CQ.Ext.form.Field to use when editing values in this column if editing is supported by the grid. See ed...
Optional. The CQ.Ext.form.Field to use when editing values in this column if editing is supported by the grid. See editable also.
|
Column | |
|
emptyGroupText : String Optional. If the grid is being rendered by an CQ.Ext.grid.GroupingView, this option may be used to specify the text t...
Optional. If the grid is being rendered by an CQ.Ext.grid.GroupingView, this option may be used to specify the text to display when there is an empty group value. Defaults to the CQ.Ext.grid.GroupingView.emptyGroupText.
|
Column | |
|
fixed : Boolean Optional. true if the column width cannot be changed. Defaults to false.
Optional. true if the column width cannot be changed. Defaults to false.
|
Column | |
|
getClass : Function A function which returns the CSS class to apply to the icon image. The function is passed the following parameters: v...
A function which returns the CSS class to apply to the icon image. The function is passed the following parameters:
|
ActionColumn | |
|
groupName : String Optional. If the grid is being rendered by an CQ.Ext.grid.GroupingView, this option may be used to specify the text w...
Optional. If the grid is being rendered by an CQ.Ext.grid.GroupingView, this option may be used to specify the text with which to prefix the group field value in the group header line. See also groupRenderer and CQ.Ext.grid.GroupingView.showGroupName.
|
Column | |
|
groupRenderer : Function Optional. If the grid is being rendered by an CQ.Ext.grid.GroupingView, this option may be used to specify the functi...
Optional. If the grid is being rendered by an CQ.Ext.grid.GroupingView, this option may be used to specify the function used to format the grouping field value for display in the group header. If a groupRenderer is not specified, the configured renderer will be called; if a renderer is also not specified the new value of the group field will be used. The called function (either the groupRenderer or renderer) will be passed the following parameters:
The function should return a string value. |
Column | |
|
groupable : Boolean Optional. If the grid is being rendered by an CQ.Ext.grid.GroupingView, this option may be used to disable the header...
Optional. If the grid is being rendered by an CQ.Ext.grid.GroupingView, this option may be used to disable the header menu item to group by the column selected. Defaults to true, which enables the header menu group option. Set to false to disable (but still show) the group option in the header menu for the column. See also
groupName. |
Column | |
|
handler : Function A function called when the icon is clicked. The handler is passed the following parameters: grid : GridPanelThe ownin...
A function called when the icon is clicked. The handler is passed the following parameters:
|
ActionColumn | |
|
header : String Optional. The header text to be used as innerHTML (html tags are accepted) to display in the Grid view. Note: to have...
Optional. The header text to be used as innerHTML (html tags are accepted) to display in the Grid view. Note: to have a clickable header with no text displayed use ' '.
|
Column | |
|
hidden : Boolean Optional. true to initially hide this column. Defaults to false. A hidden column may be shown via the header row menu...
Optional. true to initially hide this column. Defaults to false. A hidden column may be shown via the header row menu. If a column is never to be shown, simply do not include this column in the Column Model at all.
|
Column | |
|
hideable : Boolean Optional. Specify as false to prevent the user from hiding this column (defaults to true). To disallow column hiding ...
Optional. Specify as false to prevent the user from hiding this column (defaults to true). To disallow column hiding globally for all columns in the grid, use CQ.Ext.grid.GridPanel.enableColumnHide instead.
|
Column | |
|
icon : String The URL of an image to display as the clickable element in the column. Optional - defaults to CQ.Ext.BLANK_IMAGE_URL.
The URL of an image to display as the clickable element in the column. Optional - defaults to
CQ.Ext.BLANK_IMAGE_URL. |
ActionColumn | |
|
iconCls : String A CSS class to apply to the icon image. To determine the class dynamically, configure the Column with a getClass func...
A CSS class to apply to the icon image. To determine the class dynamically, configure the Column with a
getClass function. |
ActionColumn | |
|
id : String Optional. A name which identifies this column (defaults to the column's initial ordinal position.) The id is used to ...
Optional. A name which identifies this column (defaults to the column's initial ordinal position.) The id is used to create a CSS class name which is applied to all table cells (including headers) in that column (in this context the id does not need to be unique). The class name takes the form of
x-grid3-td-idHeader cells will also receive this class name, but will also have the class x-grid3-hdSo, to target header cells, use CSS selectors such as: .x-grid3-hd-row .x-grid3-td-idThe CQ.Ext.grid.GridPanel.autoExpandColumn grid config option references the column via this unique identifier. |
Column | |
|
items : Array An Array which may contain multiple icon definitions, each element of which may contain: icon : StringThe url of an ...
An Array which may contain multiple icon definitions, each element of which may contain:
|
ActionColumn | |
|
menuDisabled : Boolean Optional. true to disable the column menu. Defaults to false.
Optional. true to disable the column menu. Defaults to false.
|
Column | |
|
renderer : Mixed For an alternative to specifying a renderer see xtype Optional. A renderer is an 'interceptor' method which can be us...
For an alternative to specifying a renderer see Optional. A renderer is an 'interceptor' method which can be used transform data (value, appearance, etc.) before it is rendered). This may be specified in either of three ways:
For information about the renderer function (passed parameters, etc.), see CQ.Ext.grid.ColumnModel.setRenderer. An example of specifying renderer function inline: See also scope. |
Column | |
|
resizable : Boolean Optional. false to disable column resizing. Defaults to true.
Optional. false to disable column resizing. Defaults to true.
|
Column | |
| scope : Object | ActionColumn | |
|
sortable : Boolean Optional. true if sorting is to be allowed on this column. Defaults to the value of the CQ.Ext.grid.ColumnModel.defau...
Optional. true if sorting is to be allowed on this column. Defaults to the value of the
CQ.Ext.grid.ColumnModel.defaultSortable property. Whether local/remote sorting is used is specified in CQ.Ext.data.Store.remoteSort. |
Column | |
|
stopSelection : Boolean Defaults to true. Prevent grid row selection upon mousedown.
Defaults to
true. Prevent grid row selection upon mousedown. |
ActionColumn | |
|
tooltip : String A tooltip message to be displayed on hover. CQ.Ext.QuickTips must have been initialized.
A tooltip message to be displayed on hover. CQ.Ext.QuickTips must have been initialized.
|
ActionColumn | |
|
width : Number Optional. The initial width in pixels of the column. The width of each column can also be affected if any of the foll...
Optional. The initial width in pixels of the column. The width of each column can also be affected if any of the following are configured:
Note: when the width of each column is determined, a space on the right side is reserved for the vertical scrollbar. The CQ.Ext.grid.GridView.scrollOffset can be modified to reduce or eliminate the reserved offset. |
Column | |
|
xtype : String Optional. A String which references a predefined CQ.Ext.grid.Column subclass type which is preconfigured with an appr...
Optional. A String which references a predefined CQ.Ext.grid.Column subclass type which is preconfigured with an appropriate
renderer to be easily configured into a ColumnModel. The predefined CQ.Ext.grid.Column subclass types are:
Configuration properties for the specified |
Column | |
| Property | Defined By | |
|---|---|---|
|
renderer : Function Optional. A function which returns displayable data when passed the following parameters:
value : ObjectThe data val...
Optional. A function which returns displayable data when passed the following parameters:
|
Column | |
| Method | Defined By | |
|---|---|---|
getCellEditor( Number rowIndex ) : CQ.Ext.Editor
|
Column | |
setEditor( CQ.Ext.Editor/CQ.Ext.form.Field editor ) : void Sets a new editor for this column.
Sets a new editor for this column.
Parameters:
|
Column | |
| Event | Defined By | |
|---|---|---|
click : ( Column this, Grid The, Number rowIndex, CQ.Ext.EventObject e ) Fires when this Column is clicked.
Fires when this Column is clicked.
Listeners will be called with the following arguments:
|
Column | |
contextmenu : ( Column this, Grid The, Number rowIndex, CQ.Ext.EventObject e ) Fires when this Column is right clicked.
Fires when this Column is right clicked.
Listeners will be called with the following arguments:
|
Column | |
dblclick : ( Column this, Grid The, Number rowIndex, CQ.Ext.EventObject e ) Fires when this Column is double clicked.
Fires when this Column is double clicked.
Listeners will be called with the following arguments:
|
Column | |
mousedown : ( Column this, Grid The, Number rowIndex, CQ.Ext.EventObject e ) Fires when this Column receives a mousedown event.
Fires when this Column receives a mousedown event.
Listeners will be called with the following arguments:
|
Column | |