如何在 Kendo Grid MVC 中将列宽设置为自动调整 [英] How to set column width to autofit in Kendo Grid MVC

问题描述

<块引用>

我习惯使用具有多列的 Kendo 网格页面.
我想将列宽设置为自动调整并自动更改宽度.
请帮帮我，谢谢

@(Html.Kendo().Grid().Name("grdMarahel_Gardeshkar").ToolBar(toolbar => toolbar.Custom().Name("btnAddMarhaleh").Text("اضافه").HtmlAttributes(new { id = "btnAddMarhaleh", href = "#" })).Columns(columns =>{columns.Bound(c => c.Code).Width(50).Title("کد");columns.Bound(c => c.Desc).Width(150).Title("شرح");//自动调整column.Command(c => c.Destroy().Text("حذف")).Width(70).Title("عملیات");}).HtmlAttributes(new { style = "height: 380px;" }).Scrollable().Sortable().Resizable(rl => rl.Columns(true)).Selectable(sl => sl.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row)).DataSource(dataSource => 数据源.Ajax().Model(m => m.Id(p => p.id)).Read(read => read.Action("Get_DS_Marahel_Gardeshkar", "Home",new { intGardesh = ViewBag.CodeGardeshKar })).Destroy(del => del.Action("Del_Marhaleh_GardeshKar", "Home"))))

<块引用>

具有自动调整功能的特定列必须将列宽更改为自动调整

解决方案

一种方法是去掉Scrollable"属性，或者你可以在 dataBound 事件中使用这个函数.

 函数 Autocolumnwidth(e) {var grid = e.sender;for (var i = 0; i < grid.columns.length; i++) {grid.autoFitColumn(i);}}

I use to my page of Kendo grid that have multi columns.
I want set a column width to autofit and change width automatically.
Plz help me , thanks

@(Html.Kendo().Grid<GardeshKar.Models.v_marhaleh_marahel>()
    .Name("grdMarahel_Gardeshkar")
    .ToolBar(toolbar => toolbar.Custom().Name("btnAddMarhaleh").Text("اضافه").HtmlAttributes(new { id = "btnAddMarhaleh", href = "#" }))
    .Columns(columns =>
    {
        columns.Bound(c => c.Code).Width(50).Title("کد");
        columns.Bound(c => c.Desc).Width(150).Title("شرح");//Autofit
        columns.Command(c => c.Destroy().Text("حذف")).Width(70).Title("عملیات");
    })
    .HtmlAttributes(new { style = "height: 380px;" })
    .Scrollable()
    .Sortable()
    .Resizable(rl => rl.Columns(true))
    .Selectable(sl => sl.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Model(m => m.Id(p => p.id))
        .Read(read => read.Action("Get_DS_Marahel_Gardeshkar", "Home",
                    new { intGardesh = ViewBag.CodeGardeshKar }))
        .Destroy(del => del.Action("Del_Marhaleh_GardeshKar", "Home")))
)  

that column specific with autofit must column width change to autofit

解决方案

One way is to remove the "Scrollable" property or you can use this function in dataBound event.

        function Autocolumnwidth(e) {
            var grid = e.sender;
            for (var i = 0; i < grid.columns.length; i++) {
                 grid.autoFitColumn(i);
            }
        }

这篇关于如何在 Kendo Grid MVC 中将列宽设置为自动调整的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！