Blazor Grid – Print Data

This example uses the browser's built-in dialog to print data displayed within the DevExpress Blazor Grid component.

Implementation Details

To print Blazor Grid data, you must:

1. Add a DevExpress Blazor Grid to a page and bind it to data.
2. Add a DevExpress Blazor Button to the Grid Toolbar.
3. In the button Click event handler:
   • Disable the button to prevent repeated clicks while the request is being processed.
   • Call the ExportToPdfAsync method to export Grid data to a PDF stream. The exported PDF reflects current Grid state (filters, sort order, and grouping) and is ready for printing.
   • Wrap the PDF stream in a DotNetStreamReference and pass it to JavaScript.
   • Re-enable the button.
4. In JavaScript:
   • Convert the stream to a PDF Blob, create an object URL, and load it into a hidden iframe.
   • Invoke the browser print dialog for the hidden iframe.
   • Once the print dialog closes, remove the iframe and revoke the object URL.
5. Optional. Display the DevExpress Blazor Wait Indicator within the Print toolbar button while processing the print request.

Files to Review

• Index.razor
• print.js

Documentation

• Export Blazor Grid Data to PDF

More Examples

• Blazor Grid - Export Detail Views

Does This Example Address Your Development Requirements/Objectives?

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