使用GridColumnSettings,Kendo UI网格列可编辑为false

时间:2016-01-07 06:28:40

标签: c# kendo-ui telerik kendo-grid kendo-asp.net-mvc

我有这样的剑道网格。

@(Html.Kendo().Grid(Model.GridView.DataSource)
    .Name("grid").Columns(columns => columns.LoadSettings(Model.GridView.ColumnSettings))
    .Editable(editable => editable.Mode(GridEditMode.InLine))   
    .ToolBar(toolbar => toolbar.Create().Text("Add User"))
    .DataSource(dataSource => dataSource
        .Ajax().ServerOperation(true)
        .Model(model =>
        {
            model.Id(p => p.Id);
            model.Field(p => p.Id).Editable(false);
        })
        .Read(read => read.Action("OnGridRead", "Manage"))  
    )
)

我正在使用Kendo GridColumnSettings 来定义我的模型中的列,这是一个GridView(模型),如下所示。

 public class GridView 
    {
        public List<GridColumnSettings> ColumnSettings
        {
            get
            {
                var items = new List<GridColumnSettings>
                            {
                                new GridCommandColumnSettings
                                {
                                    Commands =
                                    {
                                        new GridEditActionCommand()
                                    },
                                    Width = "70px"
                                },
                                new GridColumnSettings
                                {
                                    Member = "Id",
                                    Hidden = true
                                },
                                new GridColumnSettings
                                {
                                    Member = "FirstName"
                                },
                                new GridColumnSettings
                                {
                                    Member = "LastName"
                                },
                                new GridColumnSettings
                                {
                                    Member = "UserName"                                

                                },
                                new GridColumnSettings
                                {
                                    Member = "Password",
                                    ClientTemplate = "***",

                                }

                            };

                return items;
            }
        }
    }

这里我只需要在网格的内联编辑模式下禁用用户名字段。 目前,GridColumnSettings类中没有可用的属性editable。如何使用 GridColumnSettings 类在网格的编辑模式中禁用用户名字段。

2 个答案:

答案 0 :(得分:3)

请尝试使用以下代码段。我在下面的演示中禁用了StudentID字段。

@(Html.Kendo().Grid<MvcApplication1.Models.Student>()
    .Name("Grid")
        //.Columns(columns =>
        //   {
        //       columns.Bound(c => c.StudentID);
        //       columns.Bound(c => c.StudentName);
        //   })
     .Columns(cols => cols.LoadSettings(ViewBag.cols))
        .Scrollable()
        .Groupable()
        .Sortable()
        .Editable(editable => editable.Mode(GridEditMode.InLine)).ToolBar(toolbar => toolbar.Create())
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
       .Events(events => events.Edit("onEdit"))
        .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("Grid_Read", "Home"))
            .Update(update => update.Action("EditingInline_Update", "Grid"))
              .Create(update => update.Action("EditingInline_Create", "Grid"))
             .Model(model =>
        {
            model.Id(p => p.StudentID);
            model.Field(p => p.StudentID).Editable(true);
        })
        )
)

方法1: -

<script>
    function onEdit(e) {
        if (e.model.isNew() == false) {
            $(e.container).find("input[name='StudentID']").attr('disabled', 'disabled'); 
        }
    }
</script>

方法2: -

<script>
    function onEdit(e) {
        if (e.model.isNew() == false) {
           $(e.container).find("input[name='StudentID']").parent().html($(e.container).find("input[name='StudentID']").val()).removeAttr('data-container-for');
        }
    }
</script>

如果有任何疑虑,请告诉我。

答案 1 :(得分:2)

请尝试以下解决方案在网格的编辑模式中禁用用户名字段。

 .Model(model =>
        {
            model.Id(p => p.Id);
            model.Field(p => p.Id).Editable(false);
            model.Field(p => p.UserName).Editable(false);
        })