如何把报表放到网页中显示(Web页面与报表简单集成例子)

1.问题描述

现在用户开发的系统基本上趋向于BS架构的浏览器/服务器模式,这些系统可能由不同的语言开发,如HTML、ASP、JSP、PHP等,因此需要将制作好的报表嵌入到这些页面中。

FineReport制作出的报表可以通过Frame框架集成到Web页面中。

2.将报表显示在Frame框架内

2.1集成方法

报表作为页面的一部分,可以以iFrame方式嵌入在网页中,指定iFrame的src即可。

1.     <iframe id="reportFrame" width="900" height="400" src="/WebReport/ReportServer?reportlet=/doc/Primary/Parameter/Parameter.cpt"></iframe>

用户可以控制iframe的位置来控制报表在页面的什么地方显示,还能够通过iframe获取到报表,从而获取报表内容或调用报表内部现成的方法,我们在后续章节会进行介绍。

注:此方法iframe的src会显示出完整的报表路径,尤其在有参数的情况下,可以使用post方式向iframe提交请求,这样src里有不会出现具体的参数了。

2.2示例

我们以HTML为例,将报表嵌入到一个HTML页面中:

1.     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

2.     <html>

3.      <head>

4.       <title>FineReport Demo</title>

5.       <meta http-equiv="Content-Type" content="text/html; charset=GBK" />

6.      </head>

7.      <body>

8.      <iframe id="reportFrame" width="900" height="400" src="/WebReport/ReportServer?reportlet=/doc/Primary/Parameter/Parameter.cpt"></iframe>

9.      </body>

10.  </html>

2.3效果查看

在浏览器中输入http://localhost:8075/WebReport/page_demo/Simple.html,效果如下:

已完成示例请参照%FR_HOME%\WebReport|page_demo\Simple.html

3.不支持将报表显示在div内

若您希望自己系统页面中的按钮调用FineReport内部现成的js方法如(打印方法),需要加载FineReport的js文件,FR的js采用jquery v1.9.2框架;

实际情况下,一个页面中可能不仅仅只有报表部分,用户可能会加载其他版本的jquery,为避免js冲突,我们建议将报表内容显示在iFrame中,而不要显示在div中。

需要调用FineReport内部的js方法时,可以通过iFrame获取报表再调用方法,具体可参考js使用说明文档。

时间: 2025-01-07 15:02:38

如何把报表放到网页中显示(Web页面与报表简单集成例子)的相关文章

怎样把报表放到网页中显示(Web页面与报表简单集成样例)

1.问题描写叙述 如今用户开发的系统基本上趋向于BS架构的浏览器/server模式.这些系统可能由不同的语言开发.如HTML.ASP.JSP.PHP等.因此须要将制作好的报表嵌入到这些页面中. FineReport制作出的报表能够通过Frame框架集成到Web页面中. 2.将报表显示在Frame框架内 2.1集成方法 报表作为页面的一部分,能够以iFrame方式嵌入在网页中.指定iFrame的src就可以. 1.     <iframe id="reportFrame" widt

如何在浏览器网页中显示word文件内容

如何在浏览器网页中显示word文件内容 把word文件读到byte[]中,再Response.OutputStream.Write(bytes)到客户端去 Page_Load事件中写: //FileStream   fs   =   new   FileStream("c:\\1.doc",   FileMode.Open,   FileAccess.Read);  FileStream fs = new FileStream(Server.MapPath("files\\1

非常好的在网页中显示pdf的方法

今天有一需求,要在网页中显示pdf,于是立马开始搜索解决方案,无意中发现一个非常好的解决方法,详见http://blogs.adobe.com/pdfdevjunkie/web_designers_guide. 其实就光看这个网站也足够了,http://www.pdfobject.com/. 记录一下主要代码: <script type="text/javascript" src="scripts/pdfobject/pdfobject.js"><

让tomcat 日志网页中显示

长话短说,将tomcat日志在网页上显示出来的办法有很多,通过用不同的软件就可以实现,但是最简单的还是在本地几条命令完事了. 同分区的话可以用硬链接实现 首先查看你的web根目录:vim tomcat/conf/server.xml 找到 <Context docBase="****这一行并进入其指定的根目录中,在根目录里执行  ln /usr/local/tomcat/logs/catalina.out . 这样会在你当前的目录里产生一个catalina.out链接文件,重启tomcat

网页中显示pdf

1.<embed width="800" height="600" src="test_pdf.pdf"> </embed> 通过的浏览器:360.Firefox.IE.Chrome 2.<object classid="clsid:CA8A9780-280D-11CF-A24D-444553540000" width="800" height="600"

在网页中显示CHM (c# csharp .net asp.net winform)

CHM即“已编译的帮助文件”,主要由.hhc(目录文件)..hhk(索引文件)以及相应的帮助主题文件(.html,.htm)这些内容编译而成. 方法对比 在网页中显示CHM内容,大致有以下几种办法: 使用某些工具来反编译,把CHM文件还原成以上相关的文件,并通过hhc文件来列出目录,内容链接到相应的html文件 依然是反编译这些文件,把相关目录及html文件内容直接存到数据库中 直接解析chm文件 这些方法有优点也有缺点: 方法1的优点是方便快捷:缺点也很明显,分散的html不便于管理也不利于搜

网页中显示pdf的方法

非常好的在网页中显示pdf的方法 今天有一需求,要在网页中显示pdf,于是立马开始搜索解决方案,无意中发现一个非常好的解决方法,详见http://blogs.adobe.com/pdfdevjunkie/web_designers_guide. 其实就光看这个网站也足够了,http://www.pdfobject.com/ 记录一下主要代码: <script type="text/javascript" src="scripts/pdfobject/pdfobject.

如何在网页中显示pdf

用如下的html代码即可(例子见http://www.cnblogs.com/zhangzujin/p/3768592.html): <div class="postBody"> <div id="cnblogs_post_body"> <p><iframe src="您要展示的pdf的网址" width="680" height="680"></ifr

当在网页中显示文本过长该怎么办?

当在网页中显示文本过长该怎么办? 当我们在设计网页页面的时候,有时候肯定会遇到这种情况,我们要显示的文本超出了我们元素的宽度.这时候调宽元素的width固然是可以的,但是太宽了又不太美观了.我们可能会想能不能不改变元素的width,让超出的部分隐藏掉,然后鼠标移动到文本上的时候把全部的内容再显示出来.下面我们就来说说CSS中能够实现这种效果的方式... 代码如下,各个样式的注释已经在代码中 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans