启用单元格编辑kendo Grid

时间:2015-11-06 11:09:25

标签: javascript asp.net-mvc kendo-grid

发布这类问题我很惭愧,但我绝望了。我是剑道新手,我很简单,可以让我的网格可编辑。 这是我的代码

 @(Html.Kendo().Grid<Server.Models.MasterFoo>()
        .Name("gridRules")
        .HtmlAttributes(new { style = "height:300px; margin: 0px" })
        .Columns(columns =>
        {
            columns.Bound(c => c)
                .ClientTemplate("<input type='checkbox' class='checkbox' />")
                .Width(24);
            columns.Bound(c => c.ID)
                .Hidden(true);
            columns.Bound(c => c.Name);
            columns.Bound(c => c.Description)
                .EditorTemplateName("Descriptions")
                .Title("SpecialDescription");
        })
        .DataSource(ds => ds
            .Ajax()
            .Model(m =>
            {
                m.Id(f => f.ID);
                m.Field(f => f.Name).Editable(true);
                m.Field(f => f.Description).Editable(true);
            })
            .Read(read => read.Action("GetFooBar", "MyController", new { area = "Administration" })
                .Data("foo.param"))
            .Update(update => update.Action("UpdateFoo", "MyController", new { area = "Administration" })
                .Data("foo.param"))
            .Batch(true)
        )
        .Events(events => events
            .SaveChanges("foo.gridChanged")
            //.Edit("foo.gridChanges")
            //.Change("foo.gridSelection")
            .DataBound("foo.gridDataBound")
        )
        .Resizable(r => r.Columns(true))
        .Scrollable()
        .Navigatable()
        //.Selectable(selectable => selectable.Mode(GridSelectionMode.Single))
        .AutoBind(false)
        .Sortable(sortable => sortable.AllowUnsort(false))
        //.Editable(editable => editable.Mode(GridEditMode.InCell))     
    )

现在我遇到了问题:我无法编辑网格。 如果我添加//.Editable(editable =&gt; editable.Mode(GridEditMode.InCell)),它根本不起作用。我使用2013年第二季度的剑道,我错过了什么? 提前谢谢。

更新以下是我启用Editable(editable => editable.Mode(GridEditMode.InCell))时发生的情况 enter image description here

2 个答案:

答案 0 :(得分:0)

这段代码很好:

.Editable(editable => editable.Mode(GridEditMode.InCell))

但您还需要工具栏中的保存按钮:

.ToolBar(toolbar =>
            {
                toolbar.Save();
            })

从kendo文档中提取:

  
      
  • 通过设置启用内联单元格编辑:.Editable(editable =&gt; editable.Mode(GridEditMode.InCell))启用添加新记录,保存   通过设置工具栏上的更改和放弃更改按钮:   .ToolBar(toolbar =&gt; {toolbar.Create(); toolbar.Save();}
  •   
  • 在DataSource声明中设置.Batch(true)和.ServerOperation(false)属性以启用批量更新并执行分页,   在客户端上进行排序,过滤和分组操作。
  •   
  • 在DataSource
  • 中调用CRUD操作方法   

答案 1 :(得分:0)

发现我只需在模型中添加无参数构造函数。

public class MasterFoo {
     public MasterFoo() {}
}

以下是我学到的课程:

  1. Kendo UI网格绑定到模型,并在添加一些属性/属性(例如editable和Filterables)时实例化它的实例
  2. 永远不要忽略错误消息
  3. 最重要的是如果无法解决你的错误,不要自杀。尝试问社区,如果还没有,请回家休息一下。