the code uses Ext 1.1 and it runs well in firefox , but it shows nothing in internet explorer 6/7 . could anyone help me to find out what is the probably cause or give me a hint on how to find out the problem. thanks very much.
the following is the html file :
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<head>
<title>main menu</title>
<link rel="stylesheet" type="text/css" href="../css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="../css/examples.css" />
<script type="text/javascript" src="../include/js/ext-base.js"></script>
<script type="text/javascript" src="../include/js/ext-all.js"></script>
<script type="text/javascript" src="../include/js/menu/menu.js"></script>
</head>
<body>
<div id="north-div"></div>
<div id="center-div" style="width:100%;height:100%">
<div id="center-tb" style="width:100%;height:100%"></div>
</div>
</body>
</html>
and the following is the menu.js file
Code:
Simple = function() {
var northPanel, centerPanel;
return {
init : function() {
var tb = new Ext.Toolbar('north-div');
tb.add(
{
text: 'menu1' ,
enableToggle: true,
toggleHandler: onButton1Click,
pressed: false
},'-');
// add a combobox to the toolbar
tb.add({
text: 'menu2' ,
enableToggle: true,
toggleHandler: onButton2Click,
pressed: false});
tb.add('-',{
text: 'menu3' ,
enableToggle: true,
toggleHandler: onButton3Click,
pressed: false});
var tabs = new Ext.TabPanel("center-tb",{
resizeTabs:true
});
var index=0;
function onButton1Click(btn){
var tab1=tabs.addTab(
Ext.id(),
'menu1' ,
'Tab Body ' + index ,
true
);
var updater = tab1.getUpdateManager();
updater.setDefaultUrl('dimensionlist.html');
updater.loadScripts=true;
tab1.activate();
tab1.on("activate",function(){tab1.bodyEl.repaint();},true);
updater.refresh();
// Ext.get('center-iframe').dom.src = 'ajax1.htm';
}
function onButton2Click(btn){
var tab2=tabs.addTab(
Ext.id(),
'menu2' ,
'Tab Body ' + index ,
true
);
var updater = tab2.getUpdateManager();
updater.setDefaultUrl('measurementlist.html');
updater.loadScripts=true;
tab2.activate();
tab2.on("activate",function(){tab2.bodyEl.repaint();},true);
updater.refresh();
// Ext.get('center-iframe').dom.src = 'dimensionlist.html';
}
function onButton3Click(btn){
var tab3=tabs.addTab(
Ext.id(),
'menu3' ,
'Tab Body ' + index ,
true
);
var updater = tab3.getUpdateManager();
updater.setDefaultUrl('initialize.html');
updater.loadScripts=true;
tab3.activate();
tab3.on("activate",function(){tab3.bodyEl.repaint();},true);
updater.refresh();
// Ext.get('center-iframe').dom.src = 'dimensionlist.html';
}
var mainLayout = new Ext.BorderLayout(document.body, {
north: {
split: true, initialSize: 30
},
center: {
titlebar: false,
}
});
mainLayout.beginUpdate();
mainLayout.add('north', northPanel = new Ext.ContentPanel('north-div', {
fitToFrame: true, closable: false ,
toolbar: tb, title: 'Content'
}));
mainLayout.add('center', centerPanel = new Ext.ContentPanel('center-div', {
fitToFrame: true
}));
mainLayout.endUpdate();
}
};
}();
Ext.EventManager.onDocumentReady(Simple.init, Simple, true);
[Help:] can not display layout,toolbar and grid in ie(it works fine in firefox)
Reply With Quote