Clear Up
SharpKit Reference

Action Class

A Grid header type which renders an icon, or a series of icons in a grid cell, and offers a scoped click handler for each icon.

  
    Ext.create('Ext.data.Store', {
            storeId:'employeeStore',
            fields:['firstname', 'lastname', 'seniority', 'dep', 'hired'],
            data:[
            {firstname:"Michael", lastname:"Scott"},
            {firstname:"Dwight", lastname:"Schrute"},
            {firstname:"Jim", lastname:"Halpert"},
            {firstname:"Kevin", lastname:"Malone"},
            {firstname:"Angela", lastname:"Martin"}
            ]
            });
            Ext.create('Ext.grid.Panel', {
            title: 'Action Column Demo',
            store: Ext.data.StoreManager.lookup('employeeStore'),
            columns: [
            {text: 'First Name',  dataIndex:'firstname'},
            {text: 'Last Name',  dataIndex:'lastname'},
            {
            xtype:'actioncolumn',
            width:50,
            items: [{
            icon: 'extjs/examples/shared/icons/fam/cog_edit.png',  // Use a URL in the icon config
            tooltip: 'Edit',
            handler: function(grid, rowIndex, colIndex) {
            var rec = grid.getStore().getAt(rowIndex);
            alert("Edit " + rec.get('firstname'));
            }
            },{
            icon: 'extjs/examples/restful/images/delete.png',
            tooltip: 'Delete',
            handler: function(grid, rowIndex, colIndex) {
            var rec = grid.getStore().getAt(rowIndex);
            alert("Terminate " + rec.get('firstname'));
            }
            }]
            }
            ],
            width: 250,
            renderTo: Ext.getBody()
            });
            

The action column can be at any index in the columns array, and a grid can have any number of action columns.

Namespace: Ext.grid.column

Constructors

Fields

Name Description
altText The alt text to use for the image element. Defaults to: ""
getClass A function which returns the CSS class to apply to the icon image.
handler A function called when the icon is clicked. The table row clicked upon.
icon The URL of an image to display as the clickable element in the column. Defaults to Ext.BLANK_IMAGE_URL .
iconCls A CSS class to apply to the icon image. To determine the class dynamically, configure the Column with a getClass function.
stopSelection Prevent grid selection upon mousedown. Defaults to: true

Methods

Name Description
disableAction(object, object) Disables this ActionColumn's action at the specified index.
enableAction(object, object) Enables this ActionColumn's action at the specified index.
© Copyright 2005-2011 SharpKit. All rights reserved.