How to Hide the View Report Button in Bold Reports

In Bold Reports, by default, the View Report button will be shown in the report preview in the parameter panel. We don’t have any API to hide the View Report button alone. If you want to hide the View Report button, hide the Parameter pane in the Toolbar items, and the parameters will not show along with the View Report button. You can hide or show it per your requirements.

Follow these steps to hide the View Report button by hiding the Parameter pane in the toolbar item settings:

1. To hide toolbar items, set the toolbar-settings property. The following code can be used in index.cshtml file to remove the parameter option from the toolbar and hide the parameter block in the Report Viewer at client side.

   <bold-report-viewer id="viewer" report-service-url="/api/ReportViewer" processing-mode="Remote" toolbar-settings="ViewBag.toolbarSettings"></bold-report-viewer>
   

2. Add the following code in your HomeController.cs file to hide the parameter block in the Report Viewer at the server side.

   public ActionResult Index()
   {
      ViewBag.toolbarSettings = new BoldReports.Models.ReportViewer.ToolbarSettings();
      ViewBag.toolbarSettings.Items = BoldReports.ReportViewerEnums.ToolbarItems.All
                                               & ~BoldReports.ReportViewerEnums.ToolbarItems.Parameters;
      return View();
   }
   

3. Now, save and run the application. The report will be rendered by hiding the View Report button along with the parameter pane in the toolbar items.
   
   

If you want to hide only the View Report button and need to show the parameters toolbar item in the Report Viewer preview, make changes to the CSS code in your application. Follow these steps:

1. Locate the CSS file of your application responsible for report rendering.
2. Look for the CSS selector .e-reportviewer-viewreport, which targets the view-report button.
3. Add the following CSS code within the .e-reportviewer-viewreport selector.

   .e-reportviewer-viewreport {
       display: none !important;
   }
   

4. Save the CSS file.
5. By setting the .e-reportviewer-viewreport selector to display: none, the View Report button will be hidden.