Kendo UI - 将命令工具栏放在网格底部

Jar*_*ter 9 asp.net-mvc kendo-ui

在我的应用程序的某些区域中,在网格命令工具栏中将自定义命令放在网格的底部而不是顶部是更加用户友好的.

我想知道这是否可以在Kendo UI中进行,或者是否还有其他一些工作要做.

下面是标准只读BUT可选网格的代码.

提前致谢!

@(Html.Kendo().Grid(Model)
.Name("AddressBookGrid")
.Columns(columns =>
{
    columns.Bound(i => i.IsOrigin).ClientTemplate("<input name='Origin' id='origin' type='radio' value='Origin' />").Width(70);
    columns.Bound(i => i.IsDestination).ClientTemplate("<input name='Destination' id='destination' type='radio' value='Destination' />").Width(70);
    columns.Bound(i => i.CompanyName).Width(120).HtmlAttributes(new { id = "CompanyName" });
    columns.Bound(i => i.AddressLine1).Width(150).HtmlAttributes(new { id = "AddressLine1" });
    columns.Bound(i => i.AddressLine2).Width(150).HtmlAttributes(new { id = "AddressLine2" });
    columns.Bound(i => i.City).Width(100).HtmlAttributes(new { id = "City" });
    columns.Bound(i => i.StateProvince).Width(70).HtmlAttributes(new { id = "StateProvince" });
    columns.Bound(i => i.PostalCode).Width(70).HtmlAttributes(new { id = "PostalCode" });
    columns.Bound(i => i.CountryCode).Width(70).HtmlAttributes(new { id = "CountryCode" });
})
.ToolBar(toolbar =>
{
    //Want to place this at the bottom
    toolbar.Custom().Text("Add").Url("#_").HtmlAttributes(new { onclick = "PopulateAddressForm()" });
})
.Resizable(resize => resize.Columns(true))
.Reorderable(reorder => reorder.Columns(true))
.DataSource(dataSource => dataSource
    .Ajax()
    .Batch(true)
    .ServerOperation(false)
)
Run Code Online (Sandbox Code Playgroud)

)

Ata*_*hev 21

不,开箱即用不支持.可以使用以下代码行完成:

$("#grid").find(".k-grid-toolbar").insertAfter($("#grid .k-grid-content"));
Run Code Online (Sandbox Code Playgroud)

这是一个演示:http://jsbin.com/ahifiz/2/edit