Black
Black

Reputation: 5367

kendo toolbar menu button with custom attributes

Say I've got a Kendo Toolbar, with a Split Button, for example:

<div id="toolbar"></div>
<script>
$("#toolbar").kendoToolBar({
    items: [
        { type: "splitButton", text: "SplitButton", menuButtons: [{text: "Option 1"}, {text: "Option 2"}] }
    ]
});

How could I add the attributes data-toggle:"modal" and data-target="myModal" to the Option 1 button?

Is there a 'Kendo' way or do I need to use jQuery/plain JS?

Upvotes: 1

Views: 969

Answers (1)

OnaBai
OnaBai

Reputation: 40887

You should use items.attributes. Your code would be something like:

<div id="toolbar"></div>
<script>
$("#toolbar").kendoToolBar({
    items: [
        {
            type: "splitButton",
            text: "SplitButton", 
            menuButtons: [
                {
                    text: "Option 1",
                    attributes:{
                        "data-toggle": "modal",
                        "data-target": "myModal"
                    }
                },
                {
                    text: "Option 2"
                }
            ]
        }
    ]
});
</script>

Upvotes: 1

Related Questions