I'm looking for a way to have a drop down of drop downs. We wish to have two non-icon buttons, Action and Font (those words would be what would be displayed to the user).
Within those dropdowns, would be regular functions like Undo, Redo, Remove Formatting. But then, have another drop down that has the icon for 'indent' but holds an additional drop down for 'indent' and 'outdent'. (Indent plugin has been installed, the buttons work on their own)
Similarly, Font would be a drop down that would hold drop downs for Font Type to pick a font, Font Size, Font Style, Color, In Paragraph Style, etc..
Which then gets included in the btnsDef for the initialized trumbowyg (just including that part of the code and not the full definition):
btnsDef: { Action: { dropdown: ['undo', 'redo', 'removeformat', 'identBtnDef'], hasIcon: false } }
But that has not worked. Undo, redo, remove format show up, but the drop down does not. I've also tried replacing identBtnDef with indentDrop and that also did not work. I've tried including the indentDrop definition right in the btnsDef but that also has not worked.
Is there a way to do this? Any help would be appreciated.
I'm looking for a way to have a drop down of drop downs. We wish to have two non-icon buttons, Action and Font (those words would be what would be displayed to the user).
Within those dropdowns, would be regular functions like Undo, Redo, Remove Formatting. But then, have another drop down that has the icon for 'indent' but holds an additional drop down for 'indent' and 'outdent'. (Indent plugin has been installed, the buttons work on their own)
Similarly, Font would be a drop down that would hold drop downs for Font Type to pick a font, Font Size, Font Style, Color, In Paragraph Style, etc..
Like this:![trumboquestion](https://user-images.githubusercontent.com/57642010/199031451-f5cf1415-6dac-406e-9765-08014e65f397.png)
I have tried creating a new button definition:
indentBtnDef = { indentDrop : { dropdown: ['indent', 'outdent'], ico: 'indent' } }
Which then gets included in the btnsDef for the initialized trumbowyg (just including that part of the code and not the full definition):
btnsDef: { Action: { dropdown: ['undo', 'redo', 'removeformat', 'identBtnDef'], hasIcon: false } }
But that has not worked. Undo, redo, remove format show up, but the drop down does not. I've also tried replacing
identBtnDef
withindentDrop
and that also did not work. I've tried including the indentDrop definition right in thebtnsDef
but that also has not worked.Is there a way to do this? Any help would be appreciated.
How to reproduce?