Добавить заголовок в панель инструментов панели инструментов Kendo U12

Question

Я ищу, чтобы добавить заголовок в панель инструментов сетки пользовательского интерфейса Kendo и выровнять его влево. Есть ли способ добавить h2 или h3 в эту область?

Также, чтобы создать стиль этой панели инструментов, я могу получить доступ к свойству стиля? (Я хочу поставить более темный цвет/градиент сверху и снизу (где нумерация страниц есть))

toolbar : [ 
     {"name": "create", template: "<img class='k-grid-add' src='add.png'/>"}, 
     {"name": "save", template: "<img class='k-grid-save-changes' src='save.png'/>"}, 
     {"name": "cancel", template: "<img class='k-grid-cancel-changes' src='cancel.png'/>"} 
    ], 

Answer 1

Класс, который идентифицирует панель Кендо Сетка является k-grid-toolbar. Таким образом, для укладки, вы могли бы использовать:

#grid .k-grid-toolbar {  
    background: red; 
} 

Для добавления некоторого содержимого в панели инструментов, вы можете использовать:

$(".k-grid-toolbar", "#grid").prepend("<h1>hello</h1>"); 

или

$(".k-grid-toolbar", "#grid").before("<h1>hello</h1>"); 
$(".k-grid-toolbar", "#grid").after("<h1>hello</h1>"); 

в зависимости, если вы хотите добавить HTML внутри div, содержащий кнопки до или после.

И grid - iddiv, содержащий grid.

Answer 2

В кендо-MVC просторечии, решение довольно простое:

@(Html.Kendo().Grid<MyGridsViewModel>() 
    .Name("MyGridsName") 
    .ToolBar(toolbar => toolbar.Template("<h4>My Grid's Title</h4>")) 
    .DataSource(datasource => ... 

Это прекрасно работает, пока вы не начнете получать с ума и пытаются использовать Create/Пользовательские кнопки строителей с панели инструментов лямбда.

В этом случае кнопки никогда не отображаются. Решение должно использовать один из других подходов, определенных в этой теме: http://www.telerik.com/forums/custom-command-button-in-toolbars