如何通过报表单元格右键控制报表跳转到不同链接地址

需求说明:

润乾报表的单元格中支持超链接属性,用户可以通过设置该属性,实现在浏览器端用鼠标点击某个单元格跳转到指定页面,并且还能够传递所需要的参数,从而实现数据的钻取(详见《玩转报表超链接》)。不过这种超链接的设置方式只能跳转到单一的指定页面,在一些特殊的业务要求中,用户可能需要基于一个单元格查看不同的明细信息。比如,用户在访问一个地区列表时,既想经由该页面查看某地区的销售收入情况,又想查看该地区的其他信息。这样,在原有方式下就需要增加多个超链接按钮,每个按钮设置不同的超链接,而这种做法不一定能符合用户的页面样式需要或者操作习惯。下面,通过一个实际例子来介绍一下,如何在页面中增加右键操作,点击右键时先弹出可钻取的列表,选择后跳转到不同的页面。

一:设置报表格式

按照实际需求,开发报表模板,如下图:

报表格式比较简单,是一个比较普通的分组报表,A2 单元格按照国家进行分组,B2 单元格按照省份进行分组,C2 单元格显示出对应的城市名称,报表展现结果如下:

现在要求,在城市列增加右键操作,右键时弹出地址选择列表。

报表单元格有个属性为 HTML 事件属性,可以在该属性中设置 html 触发事件,如在 C2 单元格的 HTML 事件属性表达式中写入:“oncontextmenu=popMenu(\’”+C2+“\’) onClick=hidemenu()”,该表达式含义为,设置点击右键时调用 popMenu 函数,并将 C2 单元格的值传入进行,这样报表中设置了 C2 单元格的右键操作,只需要在显示报表的 jsp 中实现 popMenu 这个 js 函数以及相关操作即可。

二:页面 javascript 设置

在显示报表的 jsp 的 javascript 中实现相应操作,首先,因为页面中要右键操作,所以要先屏蔽掉浏览器本身的右键,在 js 中加入如下代码:

function disClick(){

 return false;

}

document.oncontextmenu=disClick;

接下来的话就是要实现报表中指定的右键操作,整体的js代码如下:

<SCRIPT>

function disClick(){

 return false;

}

document.oncontextmenu=disClick;

var strMenu = "<div id=\\"menu\\" class=\\"clsMenu\\" onMouseover=\\"highlight()\\" onMouseout=\\"lowlight()\\">"

strMenu += "</div>"

// 判断客户端浏览器

function showmenu(){

 var rightedge=document.body.clientWidth-event.clientX

 var bottomedge=document.body.clientHeight-event.clientY

 if (rightedge<menu.offsetWidth)

 menu.style.left=document.body.scrollLeft+event.clientX-menu.offsetWidth

 else

 menu.style.left=document.body.scrollLeft+event.clientX

 if (bottomedge<menu.offsetHeight)

 menu.style.top=document.body.scrollTop+event.clientY-menu.offsetHeight

 else

 menu.style.top=document.body.scrollTop+event.clientY

 menu.style.visibility="visible"

 return false

}

function sysMenu(){

 return false

}

// 隐藏菜单

function hidemenu(){

 menu.style.visibility="hidden"

}

// 菜单项获得焦点时加亮显示

function highlight(){

 if (event.srcElement.className=="menuitems"){

 event.srcElement.style.backgroundColor="highlight"

 event.srcElement.style.color="highlighttext"

}

}

// 菜单项失去焦点

function lowlight(){

 if (event.srcElement.className=="menuitems"){

 event.srcElement.style.backgroundColor=""

 event.srcElement.style.color="menutext"

}

}

function openNewWindow(winhref,winstyle){

  var objNewWindow = window.open(winhref,"",winstyle);

 objNewWindow.focus();

}

 document.write(strMenu);

 function popMenu(cb) {

 var SubstrMenu = "<div class=\\"menuitems\\" onClick=\\"window.open(‘http://www.baidu.com/s?wd="+cb+"‘,‘_self‘)\\">查“"+cb+"”的所有客户(百度)</div>";

 SubstrMenu += "<div class=\\"menuitems\\" onClick=\\"window.open(‘http://www.baidu.com/s?wd="+cb+"‘,‘_self‘)\\">查“"+cb+"”的重点客户(百度)</a></div>";

 SubstrMenu += "<hr>";

 SubstrMenu += "<div class=\\"menuitems\\" onClick=‘hidemenu()‘>隐藏此菜单</a></div>";

 menu.innerHTML = SubstrMenu;

 showmenu();

 return false;

 }

</SCRIPT>

另外,为了更好的显示效果,还可以增加css样式来进行控制,将如下样式同样加入到jsp页面中:
```java

<STYLE>.clsMenu {

 BORDER-RIGHT: buttonhighlight 2px outset; BORDER-TOP: buttonhighlight 2px outset; VISIBILITY: hidden; BORDER-LEFT: buttonhighlight 2px outset; WIDTH: 200px; CURSOR: default; COLOR: menutext; BORDER-BOTTOM: buttonhighlight 2px outset; POSITION: absolute; BACKGROUND-COLOR: menu

}

.menuitems {

 PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-SIZE: 12px; COLOR: #000000; LINE-HEIGHT: 18px

}

</STYLE>
总结:

本例中通过报表的 HTML 事件属性实现了单元格的右键跳转到不同的链接地址,报表中除了右键属性外,还支持其他的一些触发事件操作,具体可以参考报表帮助文档:http://doc.raqsoft.com.cn/report/preference/cfsj170.html

原文地址:https://www.cnblogs.com/shiGuangShiYi/p/12114637.html

时间: 2024-11-05 12:09:33

如何通过报表单元格右键控制报表跳转到不同链接地址的相关文章

reportservice报表单元格根据条件显示不同的颜色

有时候,我们需要根据条件,让单元格显示不同的颜色: 在报表的单元格上面,点击右键--文本框属性: 点击fx,在里面写表达式: 这样表示:如果value的值大于100,就显示红色,否则就是白色. 运行报表,就会出现上面的效果.

jxl中报表单元格合并问题

WritableWorkbook wwb = Workbook.createWorkbook(endFileName);WritableSheet ws = wwb.createSheet("Sheet1", 0); ws.mergeCells(0, 0, 0, 1);//合并单元格,第一个参数:要合并的单元格最左上角的列号,第二个参数:要合并的单元格最左上角的行号,第三个参数:要合并的单元格最右角的列号,第四个参数:要合并的单元格最右下角的行号, public void genera

Kendo UI:Grid中单元格样式控制

问题 Grid某个单元格的样式怎么设置? 解决方案 使用attributes属性设置,如果有css中class属性,需要加双引号"".如 { field: "name", title: "Name", attributes: { "class": "table-cell", style: "text-align: right; font-size: 14px" } }

Excel双击“单元格”后,自动跳转到相关“工作表

Private Sub Worksheet_BeforeDoubleClick(ByVal Target As Range, Cancel As Boolean)If Target.Column = 2 Then    For Each sht In Sheets        If sht.Name <> Target.Value Then n = n + 1    Next sht    If n = Sheets.Count Then MsgBox "您选择的工作表不存在&qu

报表也可以根据单元格计算后结果进行排序

熟悉报表的人都知道,报表中实现数据排序通常有三种方法: 1. 在 sql 语句中增加 order by,如 order by id asc 2. select 函数取数时,指定排序字段,如 ds1.select(name:-1),或者按照其他字段排序,如 ds1.select(EMPID, ,,;NAME:1) 按照 NAME 字段升序排序 3. 还可以按照某字段汇总后的结果进行排序,如:ds1.group(省份; 省份:1; ds1.sum( 工业产值):-1),对数据集 ds1 按照省份进行

POWERSHELL基于ConvertTo-Htm指定单元格效果css风格html报表

基于ConvertTo-Htm的css风格和指定单元格效果html报表的生成 PowerShell本身具有一个简单但是很实用的命令 ConvertTo-Htm,可以把整个对象转换成HTML格式.事实上,作为基本的功能他已经可以实现一些漂亮的界面了.但是还是太基础了,不能满足大多数用户的需要. 一方面,Html风格能否为美轮美奂css.还有,如何指定具体某一个单元格的效果呢,让用户体验更好呢.比如说,希望把Item5列所为ERR内容的都标示红色. 网上有这类函数,但不巧的是要收费,不提供源代码.我

减少报表隐藏单元格提升报表性能

如果报表携带大量隐藏格,会对其性能影响很大.这是因为大量隐藏格会占用内存.降低运算速度.而且隐藏单元格除了单元格值外,还记录了很多显示属性值,比如:字体.颜色.显示方式等等.虽然单元格隐藏了,但是这些属性还在,而且带着这些属性计算,也会影响计算速度. 下面这个<1997年订单情况统计>报表就是比较典型的隐藏格影响性能的例子: 这个报表的"比去年同期"是指与去年同月份的比值,无对应月份则为空:要求只显示本年数据. 通过格间计算来实现这个报表,需要将1996年的数据也读取到报表

集算报表通过API修改单元格属性

有时需要在程序中动态修改已做好报表的单元格属性,包括边框.字号.颜色.对齐方式等.润乾集算报表提供了丰富的API,开发人员可以通过提供的接口快速修改报表单元格属性. 修改单元格属性主要修改报表定义ReportDefine,比如下面已经做好的订单信息表如下: 预览效果: 我们通过代码修改该报表单元格属性: //设定边框        for (int i = 2; i <=3; i++) {            for (int j = 1; j <=6; j++) {            

帆软报表(finereport)入门-2 单元格中各颜色标识的含义

帆软报表(finereport)单元格中,可根据单元格角标的颜色判断单元格进行的操作 过滤:单元格左下角黄色三角形 条件属性:单元格左上角红色三角形.  控件:单元格右侧中间的各种矩形.  左父格:单元格左侧蓝色向下的箭头.  上父格:单元格上册蓝色向右的箭头.  原文地址:https://www.cnblogs.com/Williamls/p/10523949.html