Migrate to Classic Report Designer application

To migrate an ASP.NET MVC Report Designer application from Syncfusion® Essential Studio to the classic Bold Reports® Report Designer, replace the old scripts, styles, assemblies, packages and tag prefix with the Bold Reports® ones. Bold Reports® introduces new client-side and server-side assemblies to resolve the compatibility problem between Essential Studio Report Designer versions, with changes in both the Web API service and the client-side scripts.

Use these steps to migrate from Syncfusion® Essential Studio release to Bold Reports® version lesser than v5.2.xx

The following sections provide step-by-step instructions for migrating the Report Designer from Syncfusion® Essential Studio release version to Bold Reports® version of ASP.NET MVC classic Report Designer application.

Scripts

Old Scripts New Scripts Description
ej.web.all.min.js bold.reports.common.min.js
bold.reports.widgets.min.js
bold.report-designer-widgets.min.js
ej.chart.min.js
ej2-base.min.js

ej2-data.min.js

ej2-pdf-export.min.js

ej2-svg-base.min.js

ej2-lineargauge.min.js
ej2-circulargauge.min.js
ej2-maps.min.js
bold.report-viewer.min.js
We have removed the dependency scripts for report designer from existing ej.web.all.min.js script and provided the dependency scripts as follows:

bold.reports.common.min.js - Common script for reporting widgets.

bold.reports.widgets.min.js - It contains the scripts of dependent controls that are common for both Report Designer and Report Viewer.

bold.report-designer-widgets.min.js - It contains the scripts of Report Designer dependent controls.

ej.chart.min.js - Renders the chart item. Add this script only if your report contains the chart report item.

ej2-base.min.js - Renders the gauge item. Add this script only if your report contains the gauge report item.

ej2-data.min.js - Renders the gauge item. Add this script only if your report contains the gauge report item.

ej2-pdf-export.min.js - Renders the gauge item. Add this script only if your report contains the gauge report item.

ej2-svg-base.min.js - Renders the gauge item. Add this script only if your report contains the gauge report item.

ej2-lineargauge.min.js - Renders the linear gauge item. Add this script only if your report contains the linear gauge report item.

ej2-circulargauge.min.js - Renders the circular gauge item. Add this script only if your report contains the circular gauge report item.

ej2-maps.min.js - Renders the map item. Add this script only if your report contains the map report item.

bold.report-viewer.min.js - Previews the reports designed with Report Designer.
ej.reportdesigner.min.js bold.report-designer.min.js Renamed the report designer script file. It renders the Bold Reports® Report Designer widget.

Styles

Old Scripts New Scripts Description
ej.web.all.min.css bold.reports.all.min.css We have removed the dependent controls styles for report designer from existing ej.web.all.min.css script and provided the dependent controls styles as bold.reports.all.min.css.

Remove the old scripts and styles references from existing application, then add the new scripts and styles references based on the preceding script name changes.

Assemblies

Purpose Old Assemblies New Assemblies Description
Base Assemblies Syncfusion.EJ.ReportViewer.dll

Syncfusion.EJ.ReportDesigner.dll 		BoldReports.Web.dll The Syncfusion.EJ.ReportViewer.dll and Syncfusion.EJ.ReportDesigner.dll assemblies have been combined as BoldReports.Web.dll.
MVC Helper Assemblies Syncfusion.EJ.dll

Syncfusion.EJ.MVC.dll 		BoldReports.Mvc.dll The Syncfusion.EJ.dll and Syncfusion.EJ.MVC.dll assemblies have been combined as BoldReports.Mvc.dll.

Packages

Purpose Old Packages New Packages
Server Side Helper Syncfusion.ReportDesigner.AspNet.Mvc

Syncfusion.ReportViewer.AspNet.Mvc

BoldReports.Web
MVC Helper Syncfusion.AspNet.Mvc4

Syncfusion.AspNet.Mvc5 		BoldReports.Mvc4

BoldReports.Mvc5

Register tag prefix in Web.config file

The ASP.NET MVC reporting components tag prefix has been changed from EJ() to Bold(). Open the ~/Views/Web.config file and add the BoldReports.Mvc assembly reference to the <system.web.webPages.razor> element.

Old code snippet New code snippet
<configuration>
....
....
<system.web.webPages.razor>
....
....
<pages pageBaseType="System.Web.Mvc.WebViewPage">
<namespaces>
....
....
<add namespace="Syncfusion.EJ.MVC"/>
</namespaces>
</pages>
</system.web.webPages.razor>
....
....
</configuration>
 		<configuration>
....
....
<system.web.webPages.razor>
....
....
<pages pageBaseType="System.Web.Mvc.WebViewPage">
<namespaces>
....
....
<add namespace="BoldReports.Mvc"/>
</namespaces>
</pages>
</system.web.webPages.razor>
....
....
</configuration>

Namespace changes

Assembly Name

Old Namespace

New Namespace

BoldReports.Web.dll

Syncfusion.Reports.EJ

BoldReports.Web

Syncfusion.EJ.ReportWriter

BoldReports.Writer

Syncfusion.EJ.ReportViewer

BoldReports.Web.ReportViewer

Syncfusion.EJ.ReportDesigner

BoldReports.Web.ReportDesigner

Syncfusion.Reports.EJ.Data

BoldReports.Data

Syncfusion.Reporting

BoldReports.Configuration

Syncfusion.EJ.RDL.ServerProcessor

BoldReports.ServerProcessor

BoldReports.Mvc.dll Syncfusion.JavaScript
Syncfusion.MVC.EJ Syncfusion.JavaScript.Shared 		BoldReports.Web
BoldReports.Mvc

Based on the preceding assembly and namespace changes, modify the Report Designer Web API Controller in your application.

Configure script manager

Old code snippet New code snippet
@(Html.EJ().ScriptManager()) @(Html.Bold().ScriptManager())

Control initialization

Old code snippet New code snippet
Html.EJ().ReportDesigner("designer") Html.Bold().ReportDesigner("designer")

Report export configuration

The BoldReports.Web assembly can export the reports with data visualization components such as chart, gauge, and map, only if we configure the web scripts in Report Designer Web API controller. To configure the scripts in Web API controller, refer to the following steps:

  1. Open the Report Designer Web API controller.

  2. Configure the following scripts and styles in OnInitReportOptions on Web API controller:

    • jquery-1.7.1.min.js
    • bold.reports.common.min.js
    • bold.reports.widgets.min.js
    • ej.chart.min.js - Exports the chart item. Add this script only if your report contains the chart report item.
    • ej2-base.min.js, ej2-data.min.js, ej2-pdf-export.min.js, ej2-svg-base.min.js, ej2-lineargauge.min.js and ej2-circulargauge.min.js - Exports the gauge item. Add this script only if your report contains the gauge report item.
    • ej2-maps.min.js - Exports the map item. Add this script only if your report contains the map report item.
    • bold.report-viewer.min.js

  3. You can replace the OnInitReportOptions action in Report Designer Web API controller using the following code snippet:

    [NonAction]
public void OnInitReportOptions(ReportViewerOptions reportOption)
{
    var resourcesPath = System.Web.Hosting.HostingEnvironment.MapPath("~/Scripts");

    reportOption.ReportModel.ExportResources.Scripts = new List<string>
    {
        resourcesPath + @"\bold-reports\common\bold.reports.common.min.js",
        resourcesPath + @"\bold-reports\common\bold.reports.widgets.min.js",
        //Chart component script
        resourcesPath + @"\bold-reports\data-visualization\ej.chart.min.js",
        //Gauge component scripts
        resourcesPath + @"\bold-reports\common\ej2-base.min.js",
        resourcesPath + @"\bold-reports\common\ej2-data.min.js",
        resourcesPath + @"\bold-reports\common\ej2-pdf-export.min.js",
        resourcesPath + @"\bold-reports\common\ej2-svg-base.min.js",
        resourcesPath + @"\bold-reports\data-visualization\ej2-lineargauge.min.js",
        resourcesPath + @"\bold-reports\data-visualization\ej2-circulargauge.min.js",
        //Map component script
        resourcesPath + @"\bold-reports\data-visualization\ej2-maps.min.js",
        //Report Designer Script
        resourcesPath + @"\bold-reports\data-visualization\ej.chart.min.js",
        resourcesPath + @"\bold-reports\bold.report-viewer.min.js"
    };

    reportOption.ReportModel.ExportResources.DependentScripts = new List<string>
    {
        resourcesPath + @"\jquery-1.7.1.min.js"
    };
}

    The data visualization components will not export without the preceding script configurations.