New to Telerik UI for ASP.NET Core? Download free 30-day trial

Add a Custom Button in Grid ToolBar


Product Version 2020.1.406
Product Progress® Kendo UI® Grid for ASP.NET MVC


Is there a way to create one button in the toolbar right aligned from the other buttons that opens a Kendo UI Window in the Kendo UI Grid?


One way you can add a custom button is to include a custom command button in the toolbar.

    //toolbar in Kendo UI Grid
    .ToolBar(e => {
        e.Custom().Text("Instructions").HtmlAttributes(new { id = "customButton", @class="floatRight" });

Next, on the click event of the button, add the logic to open the Kendo UI Window:

    $("#grid").on("click", "#customButton", function (e) {
        e.preventDefault();  //prevents postback

        var window = $("#window").data("kendoWindow");;

Finally, add some style to right align the Kendo UI Button.

    .floatRight {
        float: right;

See Also

In this article