extjs Portal示例中的动态列

时间:2013-09-22 07:37:45

标签: javascript extjs

extjs Portal示例中的动态列。

我想在extjs门户示例中动态插入列 - 特别是我想嵌套它们,问题是我能够动态添加列但不能删除其中的portlet,但是如果我手动嵌套列(即如果它们已经存在并且没有在运行时定义)那么一切正常,即我能够将portlet放入其中。

有人可以帮忙吗?

这是一些相关的代码:

基本声明:

Ext.define('Ext.app.Portal', {
id: 'parentPortal',
    extend: 'Ext.container.Viewport',
    requires: ['Ext.app.PortalPanel', 'Ext.app.PortalColumn', 'Ext.app.GridPortlet', 'Ext.app.ChartPortlet'],
initComponent: function(){
    items: [{                        
                        xtype: 'portalpanel',
                        id:'threecolumn',
                        region: 'center',                        
                        items: [{
                            id: 'col-1',
                            width: 200,
                            childAnchor: '50% 50%' ,
                            items: [
                                {
                                    xtype: 'portalpanel',
                                    items: [
                                        {
                                            id: 'col-4',
                                            minHeight:200
                                        }

                                    ],                                    
                                }
                            ]
                        },{
                            id: 'col-2',
                            items: [
                                {
                                    xtype: 'portalpanel',
                                    items: [
                                        {
                                            id: 'col-5',
                                            minHeight:200
                                        }

                                    ],                                    
                                }
                            ]
                        },{
                            id: 'col-3'
                        }]
                    }]
}
}

动态列:

Ext.create('Ext.app.PortalPanel', {            
              xtype: 'portalpanel',              
        });
}

1 个答案:

答案 0 :(得分:2)

请添加听众

listeners: {
                render: function() {
                    var panel = this;
                    setTimeout( function() {
                    var parent = panel.up('portalpanel');
                    var bb = Ext.ComponentQuery.query('#threecolumn')[0]
                    console.log( bb == parent );
                    parent.dd.unreg();
                    parent.dd = Ext.create('Ext.app.PortalDropZone', parent, parent.dropConfig);
                    bb.dd.unreg();
                    bb.dd = Ext.create('Ext.app.PortalDropZone', bb, bb.dropConfig);        
                    console.log(panel);
                    console.log(parent);
                    }, 500);                        
                }
              }