Blazor Grid - Export Images/Rich Text Using Spreadsheet Document APIs

The DevExpress Blazor Grid ships with built-in methods designed to export Grid data to a spreadsheet file. You should use the manual implementation described below when using cell templates (common data types requiring the use of cell templates are rich text and images). To export rich text/image content, you need to transfer data to spreadsheet cells manually.

Note: This example uses the DevExpress Office File API - a standalone library that allows you to read/write documents, spreadsheets, presentations, and PDF files. The DevExpress Office File API is included in the following subscriptions: DevExpress Office File API Subscription or DevExpress Universal Subscription.

Implementation Details

Set Up Your Grid

Add a DevExpress Blazor Grid and populate it with data. Use CellDisplayTemplate to display images/rich text within cells.

Implement an Export Engine

To export image/rich text, you must:

1. Create a Workbook instance and access the active worksheet.
2. Iterate through Grid data columns (using the GetVisibleColumns method) and create corresponding header cells in the worksheet. You can call BeginUpdateFormatting and EndUpdateFormatting methods to apply header formatting.
3. Call DxGrid.GetVisibleRowCount and DxGrid.GetRowValue methods to iterate through visible rows and obtain cell values from each row.
4. Populate the worksheet with cell values using the SetValue method.
5. Optional. Create a table to enable data filter and sorting options in the exported document.
6. Call the SaveDocument{Async}/ExportToPdf{Async} method to export the generated document.
7. Optional. Specify PrintOptions to customize document appearance.

Files to Review

• Index.razor
• CustomDocumentVisitor.cs

Documentation

• Spreadsheet Document API Examples
• Blazor Grid

Does this example address your development requirements/objectives?

(you will be redirected to DevExpress.com to submit your response)