Kendo UI 2015.2.805
Is there a way to insert a separator line between menu items on a toolbar's split button dropdown? I am familiar with adding a separator line between toolbar buttons, but I am having trouble achieving the same effect for the menuButtons array.
$("#my_toolbar").kendoToolBar({
items: [
{ type: "button", text: "Option 1" },
{ type: "separator"},
{ type: "button", text: "Option 2" },
{ type: "splitButton", text: "Actions",
menuButtons: [
{ id: "button_3", text: "Option 3" },
{ id: "button_4", text: "Option 4" },
//separator should go here
{ id: "button_5", text: "Option 5" },
{ id: "button_6", text: "Option 6" }
]
}
]
});
` How can a separator be added at the specified comment?
RESOLVED:
I am sharing David's solution here from his link for reference. In my case, I had to style the .no-button class in my environment to display it as a line, which worked perfectly for my needs.
.no-button { padding: 0;}
menuButtons: [
{ id: "button_3", text: "Option 3" },
{ id: "button_4", text: "Option 4" },
{ enable: false, attributes: { class: "no-button"} },
{ id: "button_5", text: "Option 5" },
{ id: "button_6", text: "Option 6" }
]