Export to HTML
- 9 minutes to read
This document details the export of a document to HTML format.
You can export a report from the Report Designer’s Preview and the Document Viewer on all supported platforms (WinForms, WPF, ASP.NET Web Forms, ASP.NET MVC, and ASP.NET Core). To do this, expand the Export Document drop-down list and select HTML File. Specify export options in the invoked dialog, and click OK.
To export a report document to HTML format in code, use one of the following approaches:
Export a Report
Call an XtraReport.ExportToHtml overloaded method to export a report. To export a report asynchronously in a separate task, call an XtraReport.ExportToHtmlAsync overloaded method instead. To specify export options, create a HtmlExportOptions class instance and pass this instance to the invoked method, or use XtraReport‘s ExportOptions.Html property.
using System; using DevExpress.XtraPrinting; using DevExpress.XtraReports.UI; // ... XtraReport report = new XtraReport() { Name = "HelloWorld", Bands = { new DetailBand(){ Controls={ new XRLabel(){ Text="Hello World!" } } } } }; // htmlExportFile specifies the exported file's name and path. The user's Downloads folder is used as the default path. string htmlExportFile = Environment.GetFolderPath(Environment.SpecialFolder.UserProfile) + @"\Downloads\" + report.Name + ".html"; // Specify export options to export the report. // Uncomment the lines below to specify export options in an HtmlExportOptions class instance. // HtmlExportOptions HtmlExportOptions = new HtmlExportOptions(); // HtmlExportOptions.ExportMode = HtmlExportMode.SingleFile; // report.ExportToHtml(htmlExportFile, HtmlExportOptions); // Comment the lines below if you specified export options in an HtmlExportOptions class instance above. report.ExportOptions.Html.ExportMode = HtmlExportMode.SingleFile; report.ExportToHtml(htmlExportFile);Export a Document
Call a PrintingSystem.ExportToHtml overloaded method to export a document. To specify export options, create a HtmlExportOptions class instance and pass this instance to the invoked method, or use PrintingSystem‘s ExportOptions.Html property.
using System; using DevExpress.XtraPrinting; using DevExpress.XtraReports.UI; // ... XtraReport report = new XtraReport() { Name = "HelloWorld", Bands = { new DetailBand(){ Controls={ new XRLabel(){ Text="Hello World!" } } } } }; // Create a document from the report. report.CreateDocument(); // htmlExportFile specifies the exported file's name and path. The user's Downloads folder is used as the default path. string htmlExportFile = Environment.GetFolderPath(Environment.SpecialFolder.UserProfile) + @"\Downloads\" + report.Name + ".html"; // Specify export options and export the document. // Uncomment the lines below to specify export options in an HtmlExportOptions class instance. // HtmlExportOptions HtmlExportOptions = new HtmlExportOptions(); // HtmlExportOptions.ExportMode = HtmlExportMode.SingleFile; // report.PrintingSystem.ExportToHtml(htmlExportFile, HtmlExportOptions); // Comment the lines below if you specified export options in an HtmlExportOptions class instance above. report.PrintingSystem.ExportOptions.Html.ExportMode = HtmlExportMode.SingleFile; report.PrintingSystem.ExportToHtml(htmlExportFile);Export a Control
Call a PrintingLink.ExportToHtml overloaded method to export a control. To specify export options, create a HtmlExportOptions class instance and pass this instance to the invoked method.
using System; using DevExpress.XtraPrinting; using DevExpress.XtraReports.UI; // ... DevExpress.XtraCharts.ChartControl chart = new DevExpress.XtraCharts.ChartControl() { Name = "IncomeByQuarter", Series = { new DevExpress.XtraCharts.Series("2019", DevExpress.XtraCharts.ViewType.Bar) } }; // Create a printing link. PrintingSystem printingSystem = new PrintingSystem(); PrintableComponentLink link = new PrintableComponentLink(); printingSystem.Links.Add(link); link.Component = chart; // htmlExportFile specifies the exported file's name and path. The user's Downloads folder is used as the default path. string htmlExportFile = Environment.GetFolderPath(Environment.SpecialFolder.UserProfile) + @"\Downloads\" + chart.Name + ".html"; // Specify export options and export the control. HtmlExportOptions HtmlExportOptions = new HtmlExportOptions(); HtmlExportOptions.ExportMode = HtmlExportMode.SingleFile; link.ExportToHtml(htmlExportFile, HtmlExportOptions);
Export Options
The options that can be specified for a document exported to an HTML file are stored in the HtmlExportOptions class. Use the report’s ExportOptions.Html property to access these options.
The HtmlExportOptionsBase.ExportMode property determines how a document is exported to HTML. For instance, it may be exported to a single file (with a single page header at the start and a single page footer at the end), or it may be exported page-by-page to a single file or different files.
The HtmlExportOptionsBase.TableLayout property determines whether to use the table layout in the exported HTML file. The table layout is recommended, as it uses a more compact and efficient markup.
The HtmlExportOptionsBase.ExportWatermarks property specifies whether to maintain the report’s text and image watermarks in an HTML file:
Overlapped Controls
To ensure that report controls are exported to XLS correctly, they should not intersect. Otherwise, the file layout can be corrupted.
Overlapped controls are highlighted in reports. Users can move the mouse pointer over these controls to see what needs to be fixed.
Use a report’s HasExportWarningControls collection to check if there are controls that have export warnings.
Disable a report’s DesignerOptions.ShowExportWarnings property to remove highlights on overlapped controls.
To export a report that contains overlapped controls, use the non-table layout.
Document Compatibility Options
The document styles are added to the MHT document’s <head> section. Certain mail programs may ignore styles listed in this section. To maintain a consistent look for your reports, enable the HtmlExportOptionsBase.InlineCss property to specify style properties at the same place where styles are assigned.
This property also affects how the XRPictureBox and XRBarCode controls are rendered on a web page. Images in these controls are assigned to the background-image style property. Enable the HtmlExportOptionsBase.InlineCss property to render these controls as <img> elements in the document body and store the images in the src attribute in the base64 format.
Vector images (for instance, pictures, charts, or bar codes) are always rasterized on export to MHT. You can use the PageByPageExportOptionsBase.RasterizationResolution property to specify the image resolution.
Document navigation uses scripts. To use HTML link-based navigation instead, enable the HtmlExportOptionsBase.UseHRefHyperlinks property. When users view such a document in a client web browser, script security messages are not displayed. Ensure that the controls’ Text properties are specfiied - otherwise links contain empty text and users cannot click them.
If a control’s BorderDashStyle property is set to BorderDashStyle.DashDot or BorderDashStyle.DashDotDot, the exported HTML file renders such borders as BorderDashStyle.Dash.
Control Content Customization
The following example demonstrates how to use the XRControl.HtmlItemCreated event to customize the content of an XRLabel control, when a report is exported to HTML. In the event handler, create two custom HTML elements, which will display a check box and a hyperlink on a Web page, and add them to the control’s content using the HtmlEventArgs.ContentCell property of the event parameter.
Follow the steps below to create a sample project.
- Start Visual Studio and create a new Windows Forms Application or open an existing one.
- Add a new report (named XtraReport1) to the application.
Drop an XRLabel control onto a report and handle its HtmlItemCreated event as follows.
using DevExpress.XtraPrinting.HtmlExport; using DevExpress.XtraPrinting.HtmlExport.Controls; using DevExpress.XtraReports.UI; // ... private void xrLabel1_HtmlItemCreated(object sender, HtmlEventArgs e) { // Clear content of the currently processed item. e.ContentCell.Controls.Clear(); // Create a check box. DXHtmlGenericControl checkBox = new DXHtmlGenericControl(DXHtmlTextWriterTag.Input); checkBox1.Attributes["checked"] = "true"; checkBox1.Attributes["type"] = "CheckBox"; // Create a hyperlink. DXHtmlAnchor hypLink = new DXHtmlAnchor(); hypLink.InnerText = "XtraReports Web Page"; hypLink.HRef = "https://www.devexpress.com/Subscriptions/Reporting/"; // Add the created elements to the item's content. e.ContentCell.Controls.Add(checkBox); e.ContentCell.Controls.Add(hypLink); }
Then, to export a report to HTML, you can use code similar to the following.
using System;
using System.Windows.Forms;
using System.Diagnostics;
// ...
private void ExportToHTML() {
XtraReport1 report = new XtraReport1();
report.ExportToHtml("Test.html");
StartProcess("Test.html");
}
public void StartProcess(string path) {
Process process = new Process();
try {
process.StartInfo.FileName = path;
process.Start();
process.WaitForInputIdle();
}
catch { }
}
Limitations
If a report uses a CachedReportSource, changes made in Preview are not included in single-file exports.