Toolbar - Report Viewer for Blazor

• Jul 20, 2023
• 2 minutes to read

Commands

Command	Icon	Description	Localization String Id
FirstPage		Navigates to the first page.	Toolbar_FirstPage
PreviousPage		Navigates to the previous page.	Toolbar_PreviousPage
GoToPage		Navigates to the specified page.	Toolbar_PageOfPagesFormat
NextPage		Navigates to the next page.	Toolbar_NextPage
LastPage		Navigates to the last page.	Toolbar_LastPage
HighlightEditingFields		Highlights all edit fields in the document.	Toolbar_HighlightEditingFields
ZoomOut		Decreases the document zoom factor by 5 percent.	Toolbar_ZoomOut
SetZoomFactor		Specifies the document zoom factor.
ZoomIn		Increases the document zoom factor by 5 percent.	Toolbar_ZoomIn
Print		Prints the document.	Toolbar_Print
ExportTo		Exports the document to the format selected in the drop down list.	Toolbar_ExportTo
CancelDocumentCreation		Interrupts the document creation process and cancels it.	Toolbar_CancelDocumentCreation

Customization

Handle the OnCustomizeToolbar event or use the ToolbarModel property to modify the Report Viewer toolbar. The following code snippet hides the ExportTo button:

@using DevExpress.Blazor.Reporting
@using DevExpress.XtraReports.UI

@*...*@

<DxReportViewer @ref="reportViewer" Report="@Report" >
</DxReportViewer>

@code{
    DxReportViewer reportViewer { get; set; }
    XtraReport Report { get; set; }
    // ...
    protected override void OnAfterRender(bool firstRender)
    {
        reportViewer.ToolbarModel.AllItems
            .Find(item=>item.Id=="ExportTo").Visible = false;
        base.OnAfterRender(firstRender);
    }
}

The following code removes all export formats from the Export To drop-down list except PDF and Image formats:

@using DevExpress.Blazor.Reporting.Models
@using System.Drawing.Imaging
@using DevExpress.XtraPrinting
@using DevExpress.XtraReports.UI
@using DevExpress.Blazor.Reporting
@* ... *@
<DxReportViewer Report="Report" OnCustomizeToolbar="OnCustomizeToolbar" />

@code {
    XtraReport Report;

@* ... *@
    void OnCustomizeToolbar(ToolbarModel toolbarModel)
    {
        var exportItem = toolbarModel.AllItems.Single(item =>
            item.Id == ToolbarItemId.ExportTo);
        exportItem.Items = exportItem.Items.Where(el =>
        {
            var format = ((ExportFormatItem)el).Format;
            return format == DevExpress.XtraPrinting.ExportFormat.Pdf ||
                format == DevExpress.XtraPrinting.ExportFormat.Image;
        }).ToList();
    }

The image below shows the customized toolbar.

View Example: Report Viewer for Blazor - Custom Export