日期:2014-05-16  浏览次数:20395 次

ExtJS中新增tabpanel加载其它完整页面(viewport布局中)

这个问题困扰了我两天,现在终于解决了,拿出来分享一下!

大家看看代码:

?

tree1.on('click',function(node){
    	var id=node.id;
    	var tab=Ext.getCmp('auto');
    	if(node.text == "个人资料"){
	       if(id=='information'){
	       		var tabItem=Ext.getCmp('form_information');
	       		if(tabItem==null){
					tabItem=tab.add(new Ext.Panel({
						id:"form_information",
						title:"基本信息",
						closable:true,
						autoScroll:true,
						frame:true,
						items:[{
							showMask: true,
							maskMsg: '正在加载  ',
							scripts:true,
							html:" <iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='http://localhost:8080/HH/test.html'> </iframe>"
						}]
					}));
					tab.setActiveTab(tabItem);
				}
				else{
					tab.setActiveTab("form_information");
				}
	       		
	        }else{
	        	Ext.MessageBox.alert("error");
	        }
    	}
    	else if(node.text == "在校情况"){
    		 if(id=='schoolinfo'){
    		 	
    		 }
    	}
    });

?

?关键在:

?

tabItem=tab.add(new Ext.Panel({
						id:"form_information",
						title:"基本信息",
						closable:true,
						autoScroll:true,
						frame:true,
						items:[{
							showMask: true,
							maskMsg: '正在加载  ',
							scripts:true,
							html:" <iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='http://localhost:8080/HH/test.html'> </iframe>"
						}]
					}));

?不要用autoLoad,加载后总是出现页面混乱。现在只需要把它换成html:" <iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='http://localhost:8080/HH/test.html'> </iframe>"即可,

是不是很简单啊?呵呵,做不出来的时候真的很烦恼的。希望对大家有帮助啊!

?