extjs4 grid的column中加入button按钮

在Extjs中如果要往gridpanel中加上一些按钮的话可以实现actioncolumn,来实现

但是actioncolumn渲染出来的只是一些icon ,文字只能加到tooltip中。

现在有中很简便的方法可以在column中加入button等extjs的component.
这里要用到一个函数Ext.defer()

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
{
    header: 'Buttons',
    renderer: function (v, m, r) {
        var id = Ext.id();
        var down_id = Ext.id();
        Ext.defer(function () {
            Ext.widget('button', {
                renderTo: id,
                text: 'Edit',
                handler: function () { Ext.Msg.alert('Info', r.get('name')) }
            });
            
            Ext.widget('button',{
                renderTo : down_id,
                text: 'download'
            });
        }, 50);
        return Ext.String.format('<span id="{0}"></span><span id="{1}"></span>', id, down_id);
    }
}