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中显示网页内容!