How to Customize Parameter Options in the Bold Reports Application

Bold Reports allows customization of the Report Designer interface using CSS. This enables users to hide specific parameter options such as Edit, Delete, or Add New Parameter. Such customization is particularly useful for tailoring the user experience and enforcing role-based access control, ensuring that non-admin users cannot modify report parameters.

This guide outlines the steps to hide these parameter options in a Bold Reports application.

Steps to Hide Parameter Options:

1. Add the CSS styles:

   • Include the following CSS code in your styles.css file to hide the desired parameter options:

   /* Hide parameter Edit and Delete option */
   .e-reportdesigner .e-rptdesigner-paramlist-edit {
       display: none !important;
   }
   
   /* Hide add new parameter option */
   .e-reportdesigner .e-designer-newparam-btn {
       display: none !important;
   }
   

   CSS Snippet	Property	Value	Description
   .e-reportdesigner .e-rptdesigner-paramlist-edit	display	none !important	Hides the Edit and Delete buttons in the parameter list context menu of the Reports Designer UI.
   .e-reportdesigner .e-designer-newparam-btn	display	none !important;	Hides the New Parameter button in the Bold Reports Designer interface.

2. Test the Changes:

   • Before customization: The Edit, Delete, and Add New Parameter are available in the context menu popup.
     
     
   • After style.css file update: Confirm that these options are no longer displayed in the Report Designer interface.
     
     

Conclusion

Customizing the Bold Reports’ Report Designer with CSS provides a flexible way to enhance user experience and enforce role-based access. By hiding parameter modification options for non-admin users, you can maintain a secure and streamlined reporting environment.

Download the sample application here.