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

问题描述

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

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

推荐答案

一种方法是删除"Scrollable"属性，或者可以在dataBound事件中使用此功能.

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屋！