I want to create a custom toolbar. Here is my code:

toolbar:[{
    text: "Go to Add User Page",
    className: "k-grid-custom",
    imageClass: "k-add"
}],

function createUser(){
    alert('Hello World');
}

I want to call the function named createUser when this button(custom toolbar) is clicked. How to make it possible?

I want to create a custom toolbar. Here is my code:

toolbar:[{
    text: "Go to Add User Page",
    className: "k-grid-custom",
    imageClass: "k-add"
}],

function createUser(){
    alert('Hello World');
}

I want to call the function named createUser when this button(custom toolbar) is clicked. How to make it possible?

• javascript
• kendo-ui

2 Answers 2

You could add a unique class to the button and then use that class to bind to the click event.

toolbar:[{
    text: "Go to Add User Page",
    className: "myCustomClass",
    imageClass: "k-add"
}],

$(".myCustomClass").click(function() {
    alert("Click!");
});

function test(e){
      return '<a class="k-button" href="#" id="toolbar-add_user" onclick="test_fn()">Add User</a>';
 };
function test_fn(){
        window.location = "http://www.google.";
};
 toolbar:[{
        name:'add_user',
        template:'#= test()#'
}],

1. First i had to make a function to be able to customize the button and add an onclick event.
2. Then i had to make a new function to listen to the event.