asked on May 1, 2019
Hello Flexmonster team, is it possible to have customized styling unique to items in the custom context menu? For example, we have families of items that will be listed in the menu, and we'd like a divider in the form of a thicker border between these families, but between all the elements.
Let me know your thoughts.
⋅ May 2, 2019
Hello, Daniel,
Thank you for writing to us.
We suggest using CSS to achieve customized styling. Please have a look at this sample: https://jsfiddle.net/flexmonster/rtz3Lm64/. Here you can see that the second context menu element has a custom color.
Hope it helps.
Regards,
Tanya
⋅ May 2, 2019
Our menu items will be dynamic; there might be 3 in the first group and 5 in the second group depending on the implementation and we won't be able to let the index in the list dictate the presence of a divider.
Is there any way to pass in a class that will dictate styling for the individual list item?
⋅ May 3, 2019
Hello, Daniel,
Thank you for your quick response.
Our development team can add such a feature and release it on May the 20th. Would that work for you?
Regards,
Tanya
⋅ May 3, 2019
That should be fine, as this is not a critical feature; can you give an idea of what the implementation would be? Would we designate a class name for each item in the list that we would style?
⋅ May 3, 2019
Daniel,
Thanks for your feedback.
We will add an ability to specify a class name for each context menu item (items from customizeContextMenu).
Please let us know in case of further questions.
Regards,
Tanya
⋅ May 21, 2019
Hello, Daniel,
We are glad to announce that we have added the ability to add custom CSS class to the context menu items.
You can use the new property items[].class inside customizeContextMenu.
We have prepared a JSFiddle example for illustration.
The new feature is available in the minor release version 2.7.6 of Flexmonster.
You are welcome to update the component
Please let us know if everything works fine for you.
We are looking forward to hearing from you.
Best Regards,
Vera
⋅ May 21, 2019
Thank you Vera! This seems that it would fulfill the requirement well.
