ActiveReports 在 MVC 中运行时绑定数据源

本文主要讲解的是MVC中为Activereport报表进行绑定数据源。

1、创建工程

在Visual Studio 2015中创建一个 ASP.NET MVC 4 + .NET 4.5 的工程。

2、添加报表

在工程中添加一个 RDL 报表模板，并设置数据源类型为 Object 数据源，然后通过一个表格显示该数据。参考附件中的 CustomDataSource.rdlx 文件。

3、添加服务文件

该步骤是实现运行时绑定数据源的关键，因为ActiveReports 实现所有运行时绑定数据源都是需要实现DocumentLocateDataSource() 接口，所以要添加WebService.asmx文件，在这个里面来实现。

在工程中添加一个【Web 服务】，修改该类继承的原始类型为 GrapeCity.ActiveReports.Web.ReportService。

重写OnCreateReportHandler

   protected override object OnCreateReportHandler(string reportPath)
        {
            var instance = base.OnCreateReportHandler(reportPath);
            var pageReport = instance as PageReport;
            if (pageReport != null)
            {
                pageReport.Document.LocateDataSource += Document_LocateDataSource;
            }
            return instance;
        }

4、添加相关文件

从 C:\Users\用户名\Documents\GrapeCity Samples\ActiveReports 10\HTML5 Viewer\HTML5 Viewer 路径中将 css 文件夹下的文件拷贝到 MVC 工程的 Contents 目录下；

将 Scripts 目录下的文件拷贝到MVC工程的Scripts目录下；将fonts文件夹拷贝到MVC工程的根目录下。

5、添加页面

在 Index.cshtml 文件中初始化html5viewer

<link href="~/Content/bootstrap.css" rel="stylesheet" />
<link href="~/Content/GrapeCity.ActiveReports.Viewer.Html.css" rel="stylesheet" />
<link href="~/Content/Site.css" rel="stylesheet" />
<link href="~/Content/theme-cosmo.css" rel="stylesheet" />

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/bootstrap-3.0.0.js"></script>
<script src="~/Scripts/knockout-2.3.0.js"></script>
<script src="~/Scripts/GrapeCity.ActiveReports.Viewer.Html.js"></script>

<div>
    <div id="viewerContainer" style="width:100%;height:800px;border:1px solid gray;margin-top:20px;"></div>
</div>
    <script type="text/javascript">
        $(function () {
            var viewer = GrapeCity.ActiveReports.Viewer(
            {
                element: '#viewerContainer',
                report: {
                    id: "CustomDataSource.rdlx"
                    //id: "RdlReport2.rdlx"
                },
                reportService: {
                    url: 'ActiveReportsService.asmx'
                    //url: 'ActiveReports.ReportService.asmx'
                },
                uiType: 'desktop'
            });
        });
    </script>