Search code examples
asp.net-mvcdevexpressxtrareport

Hide side and toolbar panel in DevExpress.WebDocumentViewer

I have mvc component for displaying XtraReport. Code is like this:

@Html.DevExpress().WebDocumentViewer(settings =>
{
    settings.Name = "webDocumentViewer";
    settings.Height = 770;
    settings.ControlStyle.CssClass = "fullscreen"; 
}).Bind(Model.Report).GetHtml()

Now I need to hide toolbar and side panel with params. I don't want to show them to user. How can I do this?

I saw post here: kind of mine problem but there is used another component - DocumentViewer and I need to use WebDocumentViewer

Solution

  • For now, there is no params for hiding sidebar and toolbar. You can use below css

        .dxrd-preview .dxrd-right-panel-collapse, .dxrd-preview .dxrd-right-panel, .dxrd-preview .dxrd-right-tabs {
        display: none;
}

    And use js to remove the menuitem on toolbar

        function OnCustomizeMenu(s, e) {
        var actionExportTo = e.Actions.filter(function (action) { return action.text === "Toggle Multipage Mode"; })[0]
        var index = e.Actions.indexOf(actionExportTo);
        e.Actions.splice(index, 1);
    }
    @Html.DevExpress().WebDocumentViewer(settings =>{
        settings.Name = "WebDocumentViewer";
        settings.ClientSideEvents.CustomizeMenuActions = "OnCustomizeMenu";
    }).Bind(new WebDocumentViewerCustomExportOptions.Models.XtraReport1()).GetHtml()

    Reference