Kendo Grid Custom ToolBar Buttons

On a kendo grid you can create your own toolbar buttons

custom button to call a controller action

.ToolBar(toolBar => toolBar.Custom()
    .Text("do action")
    .Action("ExportWithOpenXML", "Editor"))

custom button to call a controller action with extra data

.ToolBar(toolBar => toolBar.Custom()
    .Text("do action with data")
    .Url(Url.Action("ExportWithOpenXML", "Editor", 
                   new { page = 1, pageSize = "~", filter = "~", sort = "~" })))

or if want to call a javascript function then use.

.ToolBar(toolBar => toolBar.Custom().Name("test1").Text("Test 1").Url("#")
    .HtmlAttributes(new { onclick = "CBEditor.onClickGridClearAll()" }))

NOTE: this will override any other toolbar commands you add though

.ToolBar(toolBar => toolBar.Template("<a class='k-button k-button-icontext' onclick='CBEditor.onClickGridClearAll()' href='#'></span>Custom Command</a>"))

or if you want to add an icon then

toolBar.Custom().Name("toolClearFilters").Text(" ").Url("#").HtmlAttributes(new { onclick = "CBEditor.onClickGridClearFilters()", @class = "CBspriteClearFilters" });  

Where the class defines your icon

Above referring to version
Telerik Kendo UI Professional Q1 2015
Telerik UI for ASP.NET MVC Q1 2015

comments powered by Disqus