ianh
16 Aug 2007, 12:52 PM
I have a (very) simple page containing two tabbed pages which works fine when I open it directly within the browser.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Ext Documentation Center</title>
<link rel="stylesheet" type="text/css" href="../ext-1.0/resources/css/ext-all.css"/>
<script type="text/javascript" src="../ext-1.0/adapter/yui/yui-utilities.js"></script>
<script type="text/javascript" src="../ext-1.0/adapter/yui/ext-yui-adapter.js"></script>
<script type="text/javascript" src="../ext-1.0/ext-all-debug.js"></script>
<script type="text/javascript" src="../ext-1.0/package/tabs/tabs.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function(){
var tabPanel = new Ext.TabPanel('tabPanel');
tabPanel.addTab('panel1', 'Details');
tabPanel.addTab('panel2', 'Procedure');
tabPanel.activate('panel1');
form.render('form');
});
</script>
<div id="form">
<div id="tabPanel">
<div id="panel1">This is the content for panel 1</div>
<div id="panel2">This is the content for panel 2</div>
</div>
</div>
</body>
</html>
Things go wrong when I open this page within another ContentPanel. I only see the plain text "This is the content for panel 1 This is the content for panel 2" when I call the file using this extract...
mainLayout.beginUpdate();
mainLayout.add('center', new Ext.ContentPanel(title, {
autoCreate: true,
title: title,
fitToFrame: true,
autoScroll : true,
background : false,
closable: true}));
var pagepanel = mainLayout.findPanel(title);
mainLayout.showPanel(pagepanel);
pagepanel.load({url:"tabs-example.php"})
mainLayout.endUpdate();
Could it be because the Ext.onReady is not firing on the loaded page when it's within an existing ContentPanel, where Ext.onReady has already been called???
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Ext Documentation Center</title>
<link rel="stylesheet" type="text/css" href="../ext-1.0/resources/css/ext-all.css"/>
<script type="text/javascript" src="../ext-1.0/adapter/yui/yui-utilities.js"></script>
<script type="text/javascript" src="../ext-1.0/adapter/yui/ext-yui-adapter.js"></script>
<script type="text/javascript" src="../ext-1.0/ext-all-debug.js"></script>
<script type="text/javascript" src="../ext-1.0/package/tabs/tabs.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function(){
var tabPanel = new Ext.TabPanel('tabPanel');
tabPanel.addTab('panel1', 'Details');
tabPanel.addTab('panel2', 'Procedure');
tabPanel.activate('panel1');
form.render('form');
});
</script>
<div id="form">
<div id="tabPanel">
<div id="panel1">This is the content for panel 1</div>
<div id="panel2">This is the content for panel 2</div>
</div>
</div>
</body>
</html>
Things go wrong when I open this page within another ContentPanel. I only see the plain text "This is the content for panel 1 This is the content for panel 2" when I call the file using this extract...
mainLayout.beginUpdate();
mainLayout.add('center', new Ext.ContentPanel(title, {
autoCreate: true,
title: title,
fitToFrame: true,
autoScroll : true,
background : false,
closable: true}));
var pagepanel = mainLayout.findPanel(title);
mainLayout.showPanel(pagepanel);
pagepanel.load({url:"tabs-example.php"})
mainLayout.endUpdate();
Could it be because the Ext.onReady is not firing on the loaded page when it's within an existing ContentPanel, where Ext.onReady has already been called???