Get Free Trial

Move buttons in toolbar modals

Daniel Rutledge asked on February 13, 2019

Hello, we would like to move the buttons in the toolbar modals (specifically the ‘Fields’ and ‘Layout Options’ modals) from the top of the modal to the bottom. Are there some options or styling we could use to achieve this? We’re looking at potentially having to write our own modals if we can’t achieve this level of customization.

2 answers

Ian Sadovy Ian Sadovy Flexmonster February 14, 2019

Hello Daniel,
Thank you for the question.
As for the ‘Layout Options’ modal, its code is open and you can make any changes in the flexmonster.toolbar.js file. For example, you can move buttons to bottom by modifying the following code (see lines 1407-1410):

{ id: "fm-btn-apply", label: Labels.apply, handler: applyHandler, isPositive: true },
{ id: "fm-btn-cancel", label: Labels.cancel }
], false /* true -> false */);

Everything else can be done via CSS.
As for the ‘Fields’ modal, customization of this view is a bit limited, because the code is complex and obfuscated (in other words, it’s a part of Pivot Table component, not Toolbar). But still, you can apply some CSS to move the buttons to the bottom, here is a sample:
Please let me know if it helps.

Daniel Rutledge February 14, 2019

Thanks Ian, this will work. As you said we’re not particularly eager to rewrite the ‘Fields’ modal, as it’s rather complex. Everything else (colors, fonts, sizes) should be achievable with CSS.

Please login or Register to Submit Answer