轻量级Web 表工具ActiveReportsJS教程：如何为 表从前台传递JSON String

ActiveReportsJS 是一款基于 HTML5 的纯前端 表控件，采用拖拽式 表开发模式，无需任何服务器和组件支持，即可在 Mac、Linux 和 Windows 平台中，轻松设计中国式复杂 表、类 Excel/Word 表、DashBoard 仪表板等多种 表类型。除提供强大的 表设计能力之外，ActiveReportsJS 还具备纯前端 表展示、多数据源绑定、前端精准打印/导出等功能，借助其灵活丰富的 API ，可为您带来无与伦比的 表开发体验。

ActiveReportsJS正式版

应用场景

很多用户可以理解直接为ActiveReportsJS 表绑定数据时提供 JSON URL， 直接给它Web API 的接口就可以在 表调用了。

但有很多用户也有这样的场景，需要将后台的数据组织后，返回给前台具体JSON 字串，然后在 表中去展示和渲染，这样避免 表他直连JSON URL 只支持Get 请求的限制（不支持Post）

前提：

必须有JSON 数据的测试数据，以帮助 表能够JSON Schema获取字段名称。

操作方法：

1. 打开设计器，新建 表文件

2. 添加数据源，选择内嵌，输入测试数据：

3. 添加数据集，输入JSON 查询语句，如$.*

会看到可用的数据字段，然后设计 表样式，如添加表格控件等将字段显示到对应的位置上

4. 添加 表参数，设置为隐藏

5. 修改数据源，点击连接字符串，输入值为：=”jsondata= ” &  Parameters!P1.Value

注意P1 为参数名，修改对应为您的参数名，Parameters!您的参数名.Value

6. 在前端页面中，通过Viewer.open 把JSON 字串传给 表参数

viewer.open('reports/test.rdlx-json',{ ReportParams: [{ Name: 'P1', Value: [JSONString] }] } );

想要购买ActiveReportsJS正版授权，或了解更多产品信息请点击【咨询在线客服】

标签：