Question

Ext显示不正常的问题

刚接触ext，我用viewport做了个首页面，west是功能区，中间区域是一个tabpanel，点击功能区某个功能就会在中间区域新建一个panel面板，现在的问题是新建的面板其实也是一个jsp页面，单独运行没有任何问题，表单也能成功提交，但是我如果在首页面打开，就无法正确显示，因为新显示页面是要跟后台交互的，我在点击功能区时，打开的页面显示没问题，但无法跟后台交互，就只是个空格，有谁能解决下首页面代码main.jspExt.onReady(function(){     Ext.BLANK_IMAGE_URL = '<c:url value="../ext-3.1.0/resources/images/default/s.gif" />';   Ext.QuickTips.init();   var top=new Ext.Panel({region:'north',title:'',height:40,   html:'<center><h1>${sessionScope.loginName}，欢迎来到夏尔学生课程管理系统</h1></center>'});   var left=new Ext.tree.TreePanel({region:'west',title:'功能导航',collapsible:true,split: true,  containerScroll: true,autoScroll: true,width:200,listeners:{dblclick:function(n){   var url=n.attributes.url;   var id=n.attributes.id;   if(url){if(center.getItem(id)){center.setActiveTab(id);}   else{   var p = new Ext.Panel({   title: n.attributes.text,   id: id,   autoLoad: {url: url, scripts: true},   closable: true   });   center.add(p);   center.setActiveTab(p);  }}   }}});   var root = new Ext.tree.TreeNode({id: "1", text: "学生课程管理系统", leaf: "false"});  var addCou = new Ext.tree.TreeNode({text: "新增课程", url:'addCourse.jsp',qtip:'增加新的课程'});  var coulist = new Ext.tree.TreeNode({text: "课程管理",url:'coulist.html',qtip:'查看全部课程'});  root.appendChild([addCou, coulist]);  left.setRootNode(root);    var center = new Ext.TabPanel({  region: "center",  defaults: {autoScroll:true},  items:[{  title: "首页",  html: "欢迎使用本系统！",  id: "index"  }],  enableTabScroll: true  });  center.setActiveTab("index");    var bottom = new Ext.Panel({  region: "south",  html: "版权所有，翻版必究",  bodyStyle: "padding: 10px;text-align: center; font-size:12px"  });  var vp = new Ext.Viewport({  layout: "border",  items: [top, left, center, bottom]  });  left.expandAll();    }); 在首页面打开新增课程，页面显示正常，但是那个授课教师是从后台服务器获取的，没办法获取，而且重置提交功能都无法用，ext验证功能也失效，但是单独打开addCou.jsp界面一切正常，火狐浏览器报的错误如下，请大家帮忙下，谢谢

Answer 1

Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = '<c:url value="../ext-3.1.0/resources/images/default/s.gif" />';
Ext.QuickTips.init();
var top = new Ext.Panel({
region: 'north',
title: '',
height: 40,
html: '<center><h1>${sessionScope.loginName}，欢迎来到夏尔学生课程管理系统</h1></center>'
});
var left = new Ext.tree.TreePanel({
region: 'west',
title: '功能导航',
collapsible: true,
split: true,
containerScroll: true,
autoScroll: true,
width: 200,
listeners: {
dblclick: function(n) {
var url = n.attributes.url;
var id = n.attributes.id || n.id;
if (url) {
if (center.getItem(id)) {
center.setActiveTab(id);
} else {
var p = new Ext.Panel({
title: n.attributes.text,
id: id,
html: '<iframe width="100%" height="100%" style="border:none" frameborder=0 src="' + url + '"></iframe>',
closable: true
});
center.add(p);
center.setActiveTab(p);
}
}
}
}
});
var root = new Ext.tree.TreeNode({
id: "1",
text: "学生课程管理系统",
leaf: "false"
});
var addCou = new Ext.tree.TreeNode({
text: "新增课程",
url: 'addCourse.jsp',
qtip: '增加新的课程'
});
var coulist = new Ext.tree.TreeNode({
text: "课程管理",
url: 'coulist.html',
qtip: '查看全部课程'
});
root.appendChild([addCou, coulist]);
left.setRootNode(root);
var center = new Ext.TabPanel({
region: "center",
activeTab: 0,
defaults: {
autoScroll: true
},
items: [{
title: "首页",
html: "欢迎使用本系统！",
id: "index"
}],
enableTabScroll: true
});
var bottom = new Ext.Panel({
region: "south",
html: "版权所有，翻版必究",
bodyStyle: "padding: 10px;text-align: center; font-size:12px"
});
var vp = new Ext.Viewport({
layout: "border",
items: [top, left, center, bottom]
});
left.expandAll();
});