ExtJS給表格gridpanel的表頭加控件

示例代碼：

Ext.onReady(function () {
    Ext.tip.QuickTipManager.init();
    Ext.create('Ext.container.Viewport', {
        layout: 'fit',
        items: [
            {
                xtype: 'grid', border: 0, title: '表頭加控件的實現',
                store: {fields: [], data: []},
                columns: [
                    {text: '姓名', dataIndex: 'name',width:250},
                    {text: '性別', dataIndex: 'sex'},
                    {text: '職業', dataIndex: 'zy'}
                ],
                listeners: {
                    afterrender: function (view) {
                        var column = Ext.ComponentQuery.query('gridcolumn[dataIndex=name]')[0];
                        Ext.create('Ext.form.ComboBox', {
                            queryMode: 'local',
                            displayField: 'name',
                            valueField: 'abbr',
                            store: {
                                fields: ['abbr', 'name'],
                                data: [
                                    {"abbr": "AL", "name": "劉備"},
                                    {"abbr": "AK", "name": "關羽"},
                                    {"abbr": "AZ", "name": "張飛"}
                                ]
                            },
                            renderTo: column.el,
                            //關鍵樣式代碼
                            style: 'position:absolute;top:2px;;right:20px;!important;',
                            listeners: {
                                el: {
                                    click: function (e) {
                                        //關鍵代碼，阻止事件冒泡，引發列頭點擊事件
                                        e.stopEvent();
                                    }
                                }
                            }
                        });
                    }
                }
            }]
    });
});
備注：在Extjs5.1下測試通過，有其他個性化需求可參考此插件進行實現，謝謝。