ExtJs tab中动态添加的grid.Panel显示不在tab中，求高手！

Question

ExtJs tree的监听
listeners : {
itemclick : {
fn : function(view, record) {
var tab = Ext.getCmp(record.data.id); // 获得当前要添加tab的ID
if (!tab) {
centerPanel.add({
id : record.data.id,
title : record.data.text,
closable : true,
//html : record.data.id,
autoLoad : {
  url : record.data.url, // 这里实际上是存的一个userList.action
  loadMask : 'loading...',
  autoLoad : true,
  scripts: true  // 加载的页面中js可运行
} }).show();
} else {
tab.show();
}
},
scope : this
}
}当url : record.data.url的action成功后，跳转到一个xxx.jsp中，这个JSP中引用userList.js，userList.js中是这样写的：Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    columns: [
        { text: 'Name',  dataIndex: 'name' },
        { text: 'Email', dataIndex: 'email', flex: 1 },
        { text: 'Phone', dataIndex: 'phone' }
    ],
    authShow : true,
    renderTo: Ext.getBody()
});当我点击用户列表时
，就出现问题了，gridPanel不在tab中显示，而是显示在整个页面的头部，如图：问题在哪里？这个问题搞了一天了，还是没有一个解决方案，不知道问题在哪里，求高手指点extjstabgridpanel

Answer 1

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    columns: [
        { text: 'Name',  dataIndex: 'name' },
        { text: 'Email', dataIndex: 'email', flex: 1 },
        { text: 'Phone', dataIndex: 'phone' }
    ],
    authShow : true,
    renderTo: Ext.getBody()
});
renderTo是渲染到哪里，你的Ext.getBody()又不是你指定的tab，当然不在了

Answer 2

请问，我该如何去做到renderTo : 到这个tab中去？

Answer 3

var tabs = Ext.create('Ext.tab.Panel', {
    items: [
        {
            title: 'Tab 1',
            layout: 'anchor', // 锚点布局
    items: [ grid_panel ]
        }
    ]
});
//直接把tabs加到centerPanel里面就可以了

Answer 4

我没太明白你的意思，tab是点击节点动态生成的，可以说的详细点吗？

Answer 5

你的那个tab是已经存在的吧。可以用renderTo:Ext.getCmp( "tab的id" );

Answer 6

或者你点击用户列表时，应该会执行一个函数/方法吧，你在那里面写Ext.getCmp( "tab的id" ).xxx什么来着我给忘了，1年多没弄这个了;
意思就是获得tab控件，然后把grid.panel添加进去。 上网查下就知道代码怎么写了。

Answer 7

qiang0322,感谢你给我提示，现在呢，我可以获得到当前tab的id,但不知道为什么，我并不能把他渲染到里面去，在当前的活动tab中并不能显示出gridpanel，代码如下：Ext.onReady(function() {
Ext.create('Ext.data.Store', {
storeId : 'simpsonsStore',
fields : ['name', 'email', 'phone'],
data : {
'items' : [{
'name' : 'Lisa',
"email" : "[email protected]",
"phone" : "555-111-1224"
}, {
'name' : 'Bart',
"email" : "[email protected]",
"phone" : "555-222-1234"
}, {
'name' : 'Homer',
"email" : "[email protected]",
"phone" : "555-222-1244"
}, {
'name' : 'Marge',
"email" : "[email protected]",
"phone" : "555-222-1254"
}]
},
proxy : {
type : 'memory',
reader : {
type : 'json',
root : 'items'
}
}
}); var gridPanel = Ext.create('Ext.grid.Panel', {
title : 'Simpsons',
store : Ext.data.StoreManager.lookup('simpsonsStore'),
columns : [{
text : 'Name',
dataIndex : 'name'
}, {
text : 'Email',
dataIndex : 'email',
flex : 1
}, {
text : 'Phone',
dataIndex : 'phone'
}],
renderTo : Ext.getCmp('sjxc-contentPanel').getActiveTab().id
});

});

Answer 8

我的意思是你可以根据tab的id获得这个tab的控件。然后渲染到这个tab中。

Answer 9

wxl1214471你好！我遇到相同问题，请你分享一下你的解决方法！！！！