Document Viewer for Web
- 5 minutes to read
The Web Document Viewer is a component that displays an interactive preview of a document generated from a report that is designed in the DevExpress Reporting platform. The Document Viewer allows the user to view, print, and export the report document.
The Document Viewer is designed to display only DevExpress Reports. Our reports use the XML-based report file format, which is not compatible with third-party reporting applications. We offer a utility to convert third-party reports to DevExpress format. Refer to the following help topic for more information: Convert Third-Party Reports to DevExpress Reports.
Tip
Use the XRRichText report control to display RTF and DOCX files, and the XRPdfContent report control to display PDF files in a report. You can use other DevExpress components to display different document types in your apps. Review the following help topic for more information: DevExpress Document Viewers for Web.
The Document Viewer component is available for ASP.NET WebForms, ASP.NET MVC, ASP.NET Core and Blazor platforms, and can be integrated into JavaScript applications based on Angular, React, and Vue frameworks.
Application Architecture
The following diagram shows a web reporting application with the Document Viewer control.
- DevExpress .NET Reporting Engine
- DevExpress Reporting for Web is based on the report engine written in .NET. The report engine operates server side, creates report documents, and converts them to a variety of export formats.
- Report Class
- An instance of a class that inherits from the XtraReport class. A report engine uses the report to create a document that can be previewed, printed, and exported.
- REPX File
- A file or data stream in REPX format. A report can be saved in a XML format in a report definition file (REPX). Report definitions that you create in a web application can be reused in a desktop application, and vice versa.
- Document Viewer Control
- A control that uses server-side stateful service. The server performs all the necessary actions - retrieves data from the data source, creates a list of parameter values, generates documents, and renders pages for previewing, exporting, and printing. The Document Viewer allows the user to specify report parameters, and accepts user input for interactive reports. User-defined data, and report or document identifiers are sent to the server. The server returns a rendered document, which the Document Viewer displays.
- Visual Studio Report Designer
- The DevExpress Report Designer that is based on the Visual Studio designer and allows you to create, edit, save, and load a report. The Visual Studio Report Designer is invoked automatically when you open a report class in Visual Studio.
- Report Name Resolution Service
- A service or a group of services that process a report name or a string that the Document Viewer sends to the server as a parameter in the Open method to create a report instance. The string can contain report parameters and additional data. You can register your custom implementation of these services and return a report with custom data and parameters applied at runtime. For more information, review the following help topic: Open a Report in ASP.NET Core Application.
Integration and Functionality
The Document Viewer component enables users to display a report, specify report parameters, and use interactive features to modify report content. Users can print a report or export it to a variety of export formats.
For more information, review the following help topics:
- Get Started with DevExpress Reporting
- Use Report Parameters
- Provide Interactivity
- Document Export Overview
Document Viewer integration has its own specifics. Review the Document Viewer Requirements and Limitations help topic for the ASP.NET Web Forms and ASP.NET MVC platforms.
User Interface
The Document Viewer UI is described in the End-User Documentation section.
A general technique that allows you to customize the UI elements in Reporting components: Use Custom HTML Templates.
For more information, review the Customization topic in the Document Viewer section for a particular platform.
Component Lifecycle
For a detailed description of how the component operates, review the following help topic: Document Viewer Lifecycle.
You can implement and register the WebDocumentViewerOperationLogger class descendant to execute custom code at all stages of the Document Viewer lifecycle, before a document is built, exported, or printed.
Common Tasks
The following tasks are typical for the reporting application with the Document Viewer:
Open a Report by Name
The Document Viewer’s OpenReport method accepts a string identifier as a parameter. The string is passed to the report name resolution services to create a report instance. You can register your custom implementation of these services and return a report with custom data and parameters applied at runtime. For more information, review the following help topic: Open a Report in ASP.NET Core Application.
Pass Parameters from the Client to a Report
Include parameters as a query string and use this URL as a report identifier to open a report. The OpenReport method calls the report resolver service, and you should register a custom service that parses the string, retrieves the report name, parameter names and values, and instantiates a report. You can also use JSON serialization/deserialization to pass data in a query string. For more information, review the following topics:
- Specify Parameter Values in a Web Forms Reporting Application
- Specify Parameter Values in an Angular Reporting Application
Specify a Data Source at Runtime
Review the Restore Data Bindings help topics that address this type of scenario for the ASP.NET Web Forms, ASP.NET MVC and ASP.NET Core platforms.
You can also store only the connection name and specify the connection parameters at runtime. For more information, review the following documents: