ExtJS Panel使用contentEl自动调整大小

Question

I created a panel as

Ext.create("Ext.panel.Panel", {
renderTo: Ext.getBody(),
contentEl: 'myDiv',
id: 'mypanel'
});


where the 'myDiv' is
<div id="myDiv">
<table id="table1" border="1" cellspacing="1" cellpadding="2">
</table>
</div>


When I add rows to the HTML table, the panel doesn't adjust its height automatically to accommodate the complete table.

Please let us know if I can achieve it by some configuration to the panel instead of calling panel.doLayout() every time when I add a new row.

Example fiddle: https://fiddle.sencha.com/#fiddle/33i

Thanks in advance.

Answer 1

No, not possible. The reason you need to run the layout is because you're modifying an element in the DOM that Ext doesn't know about or measure. The only reasonable "automatic" way to do that would be to use a timer and check if the DOM has changed, which isn't a good solution.