Skip to main content

Add an End-User Report Designer to an ASP.NET Web Forms Application

  • 3 minutes to read

This tutorial demonstrates how to place an End-User Report Designer onto a web page in an ASP.NET Web Forms application.

  1. In Visual Studio, open an existing application or create a new one from scratch.
  2. Press CTRL+ALT+X to run the Toolbox. Expand the DX.23.2: Reporting category and drop the ASPxReportDesigner control onto the page.

    asp-net-report-designer

  3. Call the ASPxReportDesigner.OpenReport or ASPxReportDesigner.OpenReportXmlLayout method to assign a report to the Report Designer.

    You can also restore a report layout from a file or stream using the XtraReport.FromFile or XtraReport.LoadLayout method.

    Note

    If you implement a custom report that inherits from XtraReport and want to open it in the End-User Report Designer, add a constructor without parameters to this report.

    protected void Page_Load(object sender, EventArgs e) {
        XtraReport1 report = new XtraReport1();
        ASPxReportDesigner1.OpenReport(report);
    }
    
  4. Add the “resources” section to the application’s Web.config file to automatically transfer all necessary script files to a client application.

    <devExpress>
        <!-- ... -->
        <resources>
            <add type="ThirdParty" />
            <add type="DevExtreme" />
        </resources>
    </devExpress>
    

    Alternatively, you can avoid automatic loading of libraries by a control (for example, when such libraries are already referenced on the web page) by declaring an empty “resources” section and manually attaching DevExtreme resources and the required third-party libraries to the web page.

    <resources>
    </resources>
    

    Deleting the DevExpress “resources” section from the Web.config file enables the default behavior (with automatic loading only of DevExtreme without adding third-party libraries).

    See the following topic for more information on Report Designer integration: Report Designer Requirements and Limitations.

  5. Register the ASPxHttpHandlerModule in the web.config file, as described in the following help topic: Register HTTP Handlers.

  6. You can enable the Report Designer to use HttpContext (Session or User) by specifying the Session State property in the control’s smart tag.

    This adds all necessary handlers to the application’s Web.config file and registers them at the application startup in the Global.asax file.

    protected void Application_Start(object sender, System.EventArgs e) {
        DevExpress.XtraReports.Web.WebDocumentViewer.Native.WebDocumentViewerBootstrapper.SessionState = 
            System.Web.SessionState.SessionStateBehavior.Required;
    
        DevExpress.XtraReports.Web.QueryBuilder.Native.QueryBuilderBootstrapper.SessionState = 
            System.Web.SessionState.SessionStateBehavior.Required;
    
        DevExpress.XtraReports.Web.ReportDesigner.Native.ReportDesignerBootstrapper.SessionState = 
            System.Web.SessionState.SessionStateBehavior.Required;
    }
    
  7. Implement a report storage used to store reports created in the Report Designer. Enabling this feature is required to support editing of subreports.
  8. If required, you can register default data sources available for all report design sessions in the Report Designer.
  9. You can also register default data connections available in the Data Source Wizard when creating new data sources.

Run the application to view the ASP.NET page in a web browser.

getting-started-web-report-designer

See Also