示例说明
我们有时候会需要在电子表格报表的某个单元格上添加新的按钮,实现一些特殊的需求。比如添加按钮,点击时发送一个异步的http请求。类似上述需求,皆可以参照如下方法进行设置。参考示例:
版本及客户端说明
1.smartbi版本:最新版本
2.客户端:PC
3.浏览器:IE11、谷歌浏览器(Chrome)、火狐浏览器(Firefox)
设置方法
1、首先在电子表格设计器(Microsoft Office Excel)中,创建电子表格报表。
注意本示例中我们要将按钮添加到产品目录的下一行,也就是Excel模板中B6单元格,为保证在代码中能够取到该单元格,需要在B6单元格输入一个空格
2、在浏览器的“分析展现”节点下,选中电子表格,右键选择 编辑宏 进入报表宏界面。
3、在报表宏界面新建服务端模块。在弹出的新建模块对话框中,选择对象为spreadSheetReport、事件为beforeOutPut、并把下面宏代码复制到代码编辑区域。
宏类型
类型 | 对象 | 事件 |
---|---|---|
ServerSide | spreadsheetReport | beforeOutPut |
宏代码
代码块 | ||||
---|---|---|---|---|
| ||||
function main(spreadsheetReport) {
spreadsheetReport.printExpandedPositions();//打印展开后所有单元格
} |
4、在报表宏界面新建客户端模块。在弹出的新建模块对话框中,选择对象为spreadSheetReport、事件为onRender、并把下面宏代码复制到代码编辑区域。
宏类型
宏代码
代码块 | ||||
---|---|---|---|---|
| ||||
function main(spreadsheetReport, isAjaxRefreshCallback) {
//获取B5单元格字段扩展出来的数据
var Pos = spreadsheetReport.getExpandedPositions("B5");
//获取B5单元格中字段扩展出的数据的最后一行行号
var lastRow = spreadsheetReport.parseCellIndex(Pos[Pos.length - 1])[0];
//获取B5单元格数据下的一行,第二列的数据,从0开始计数,因此坐标为lastRow+1,1
var td = spreadsheetReport.getCell(lastRow + 1, 1);
//添加按钮
td.innerHTML = "<input type='button' value='提交'>";
td.firstChild.onclick = function() {
alert("添加按钮成功!");
}
}
|
5、如果按钮添加的行的上方均为静态数据,不存在扩展字段,如下图按钮添加的位置
则可以不添加服务端宏,直接使用以下客户端宏实现。
宏类型
宏代码
代码块 | ||||
---|---|---|---|---|
| ||||
function main(spreadsheetReport, isAjaxRefreshCallback) {
//获取D2单元格
var td = spreadsheetReport.getCell(1, 3);
//添加按钮
td.innerHTML = "<input type='button' value='新按钮'>";
td.firstChild.onclick = function() {
alert("添加按钮成功!");
}
} |
关键对象总结
通过spreadsheetReport.getCell(x, y)方法,获取单元格。
- 若按钮添加在扩展单元格的下方,则需要先获取扩展单元格的数据最后一行行号,再添加中间差距的行号,以此获得按钮所在的行号
资源下载
报表资源:电子表格单元格中添加按钮.xml
borderColor | #BBBBBB |
---|---|
bgColor | #F0F0F0 |
borderWidth | 1 |
borderStyle | solid |