Get Free Trial

How to rerender toolbar

Paulo Goncalves asked on November 11, 2020

Hi, I’m wondering if it’s possible to rerender the toolbar. My component is rerendering and I can confirm the beforetoolbarcreate is not getting called.
What I’m trying to achieve is show/hide certain menu items without having to refresh the entire page. eg: moving from view to edit.

3 answers

Mykhailo Halaida Mykhailo Halaida Flexmonster November 12, 2020

Hi Paulo,
Thank you for posting your question.
Please note that the default Flexmonster toolbar wasn’t designed to be modified on the run – instead, the available customization through the beforetoolbarcreated event handler allows you to adjust the toolbar to your needs before it is rendered.
In case you need to be able to modify the tabs at runtime, we would suggest implementing your own toolbar/another UI element that would provide access to the necessary functionality, while also being modifiable on the run.
Everything that the default toolbar does is available through the Flexmonster API calls, meaning you will have no issues linking the required functionality to your own toolbar implementation.
Please let us know if this helps.
Best regards,

Paulo Goncalves November 12, 2020

Hi Mykhailo,
Thanks for the reply, I achieved what I need by modifying the toolbar element css as bellow.

this.flexmonsterRef.current.flexmonster.toolbar.dataProvider.forEach((item) => {
if (TOOLBAR_REF_IDS.includes( {
const element = document.getElementById(;
if (!element) return; = routes.isViewRoute ? 'hidden' : 'visible';
Mykhailo Halaida Mykhailo Halaida Flexmonster November 13, 2020

Hi Paulo,
Thank you for the update – we’re glad you’ve found a solution that works for you!
Feel free to reach out if there is anything else we can help you with.
Best regards,

Please login or Register to Submit Answer