ExtJs4 in the column gird increase the Action column, and to the operating button binding event

Why 80% of the code can not do farming architect? >>>  

In the ExtJs4, there Ext.grid.column.Action Grid assembly components, all to increase the operating column, only the specified column is actioncolumn xtype can, for example:

Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody(),
    width: 500,
    height: 400,
    store: Ext.create('Ext.data.Store', {
        fields: ['id', 'name'],
        data: [
            {id: '1', name: '张三'},
            {id: '2', name: '李四'}
        ]
    }),
    columns: [
        {text: '姓名', dataIndex: 'name', flex: 1},
        {
            xtype: 'actioncolumn',
            text: '操作',
            width: 100,
            tdCls: 'action',
            items: [{
                icon: 'images/edit.png',
                tooltip: '编辑',
                handler: function (grid, rowIndex, colIndex, node, e, record, rowEl) {
                    // do something...
                }
            }, {
                icon: 'images/delete.png',
                tooltip: '删除',
                handler: function (grid, rowIndex, colIndex, node, e, record, rowEl) {
                    // do something...
                }
            }]
	}
    ]
});

But if Ext MVC to write words, such wording is not suitable, in order to move the process handler in the control layer controller to go inside, it must be bound to trigger an event handler:

items:[{
    action: 'edit',
    icon: 'images/edit.png',
    tooltip: '编辑',
    handler: function (grid, rowIndex, colIndex, node, e, record, rowEl) {
        this.fireEvent('itemclick', this, grid, rowIndex, colIndex, node, e, record, rowEl);
    }
}, {
    action: 'delete',
    icon: 'images/delete.png',
    tooltip: '删除',
    handler: function (grid, rowIndex, colIndex, node, e, record, rowEl) {   
        this.fireEvent('itemclick', this, grid, rowIndex, colIndex, node, e, record, rowEl);
    }
}]

In the controller control layer, in the event of itemclick to write:

init: function () {
    this.control({
        'grid actioncolumn': {
            itemclick: this.actionBtnEvent
        }
    })
},
actionBtnEvent: function (column, grid, rowIndex, colIndex, node, e, record, rowEl) {
    if (node.action == 'edit') {
        // do something...
    } else if (node.action == 'delete') {
        // do something...
    }
}

Reproduced in: https: //my.oschina.net/mayude/blog/592764