Extjs中对于iFrame的使用

Extjs中对于iFrame的使用

注：Extjs中没有iFrame，只能用html中的来代替！

方式：

在Extjs的元素中加上下面这句话：

html:"<iframe id='frame' name='frame' src='http://******' width=100% height=100%/>"

一.Jsp页面文件：

<%@page import="com.datanew.czfc.enterprise.entity.Enterprise"%>
<%@page import="com.datanew.czfc.util.Configuration"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="com.datanew.czfc.maintain.entity.User"%>
<%
	String swdjzh = null;
	User user = (User)request.getSession().getAttribute("user");
	Enterprise enterprise = user.getMap_en();
	if(enterprise != null){
		swdjzh = user.getMap_en().getSwdjzh();
	}
	String reportip = Configuration.getConfig().getString("reportip");//读取配置文件中的内容
	String reportport = Configuration.getConfig().getString("reportport");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>企业基本信息</title>
<script type="text/javascript">
	var swdjzh = "<%= swdjzh%>";
	var reportip = "<%= reportip%>";
	var reportport = "<%= reportport%>";
</script>
<link rel="stylesheet" type="text/css" href="../css/dfCommon.css" />
<link rel="stylesheet" type="text/css" href="../js/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="../js/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../js/ext/ext-all.js"></script>
<script type="text/javascript" src="../js/ext/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="../js/ext/Ext.ux.tree.TreeCheckNodeUI.js"></script>
<script type="text/javascript" src="../js/dfCommon.js"></script>
<script type="text/javascript" src="../js/modules/project/enterpriseMessage.js"></script>
</head>
<body>
</body>
</html>

二.用于显示内容面板的JS文件：

/**
 * =================================
 * ===========企业基本信息页面JS=========
 * =================================
 */
Ext.onReady(function(){
	Ext.BLANK_IMAGE_URL = '../js/ext/resources/images/default/s.gif';
 	Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
	Ext.QuickTips.init();
	var viewPort = new Ext.Viewport({
		layout:"fit",
		items:[enterTab]
	});
});

var enterTab = new Ext.TabPanel({
	id:"enterTab",
	activeTab:0,
	enableTabScroll:true,
	layoutOnTabChange:true,
	width : 800,
	height : 600,
	items:[{
		layout:"fit",
		title:"企业基本信息",
		html:"<iframe id='frame' name='frame' src='http://"+reportip+":"+reportport+"/HappyServer/hrServlet?fileName=hte_2014_10_16154541421&targetVolume=czfc&authId=anonymous_czfc&variants=PA_SWDJZH="+swdjzh+";ISTB=1;' width=100% height=100%/>"
	}]
});

图示：在Tab面板中显示一个frame,frame中显示网页内容！

Extjs中对于iFrame的使用

猜你喜欢