Adding a Custom Button in the Grid's ToolBar
Environment
Product Version | 2020.1.406 |
Product | Telerik UI for ASP.NET MVC Grid |
Description
Is there a way to create one button in the toolbar right aligned from the other buttons that opens a Telerik UI for ASP.NET MVC Window in the Grid for ASP.NET MVC?
Solution
To add a custom button:
-
Include a custom command button in the toolbar.
// Toolbar in the Grid .ToolBar(e => { e.Pdf(); e.Excel(); e.Custom().Text("Instructions").HtmlAttributes(new { id = "customButton", @class="floatRight" }); })
-
On the click event of the button, add the logic to open the Telerik UI for ASP.NET MVC Window.
$("#grid").on("click", "#customButton", function (e) { e.preventDefault(); //prevents postback var window = $("#window").data("kendoWindow"); window.open(); });
-
Finally, add some style to right align the Telerik UI for ASP.NET MVC Button.
.floatRight { float: right; }