@(Html.Kendo().Grid<SysRoleModel>
()
.HtmlAttributes("")
.AutoBind(true)
.Name("grid")
.Selectable(selectable =>//Grid选中设置
{
selectable.Enabled(true);//是否可以选中
selectable.Type(GridSelectionType.Row);//选中行还是单元格；Row为行模式；Incell为单元格模式
selectable.Mode(GridSelectionMode.Multiple);//选中一行还是可以选中多行；Single为单选；Multiple为多选
})
.Columns(columns =>
{
columns.Template("<input class=\"box\" id=\"assignChkBx\" name=\"assignChkBx\" title=\"#=RoleName#\" CompanyRole=\"#=CompanyRole#\" type=\"checkbox\" value=\"#=Id#\" onclick=\"selectRow(this)\"/> ")
.Width(50)
.ClientHeaderTemplate("<input class=\"selectAll\" type=\"checkbox\" id=\"allBox\" onclick=\"selectAllRow(this)\" /></text>")
.HeaderHtmlAttributes(new { style = "text-align: center" })
.HtmlAttributes(new { style = "text-align: center" });
columns.Bound(c => c.RoleName).Title("角色名称").Width(150).HeaderHtmlAttributes(new { style = "text-align: center" });
columns.Bound(c => c.RoleDescription).Title("角色说明").Width(150).HeaderHtmlAttributes(new { style = "text-align: center" });
columns.Bound(c => c.Remark).Title("备注").Width(117).HeaderHtmlAttributes(new { style = "text-align: center" });
columns.Bound(c => c.Enabled).Title("是否有效").Width(117).HeaderHtmlAttributes(new { style = "text-align: center" }).ClientTemplate("#if(Enabled=='1'){#" +
"<span>是</span>" +
"#}else {#" +
"<span>否</span>" +
"#}#").HtmlAttributes(new { style = "text-align: center" });
columns.Bound(c => c.CompanyRole).Title("系统角色").Width(117).HeaderHtmlAttributes(new { style = "text-align: center" }).ClientTemplate("#if(CompanyRole=='1'){#" +
"<span>是</span>" +
"#}else {#" +
"<span>否</span>" +
"#}#").HtmlAttributes(new { style = "text-align: center" });
columns.Bound(c => c.InDate).Title("录入时间").Width(126).HeaderHtmlAttributes(new { style = "text-align: center" }).Format("{0:yyyy-MM-dd HH:mm:ss}");
})
.Pageable(page => page
.Refresh(true)
.ButtonCount(10)
.PageSizes(new[] { 20, 30, 50 })
.Messages(mess => mess.ItemsPerPage("每页显示数目").Display("显示{0}-{1}条，共{2}条"))
)//分页设置
.Sortable() // 是否支持排序
.Scrollable(c => c.Height("100%"))
.HtmlAttributes(new { @class = "k-grid-autoheight" })
.Events(c => c.DataBound("window.kendoGridAutoHeightDataBound"))
.PersistSelection()
.Reorderable(reorderable => reorderable.Columns(true))//是否支持列的拖拽
.Resizable(resizable => resizable.Columns(true))//设置Grid是否可以手动调整列宽
.ColumnMenu()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.ServerOperation(true)
.Model(model => model.Id(p => p.Id))
.Read(read => read.Action("Role_Read", "Role").Data("GetCriteria"))
)
)
Scrollable Properties set 100% Why does not work, I want to make the grid control automatically according to the interface height how to set
1 Answer, 1 is accepted
Thank you for providing the current code.
This scenario will require using additional CSS rules and programmatically resize the Grid on window resize. Please check the following example demonstrating this:
https://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/Layout/resize-grid-when-the-window-is-resized
As this is only using CSS and clientside method, the MVC implementation is similar, only the header or the footer in the _Layout.cshtml has to be taken into account.
I hope this is helpful.
Regards,
Stefan
Progress Telerik