Telerik UI for ASP。NET MVC?下载30天免费试用

批量编辑

Telerik UI Grid组件用于ASP。NET MVCenables you to implement cell editing and make and save batch updates.

有关可运行的示例,请参阅批量编辑网格的演示

要正确执行网格的更新、创建和销毁,必须定义Schema.Model.Id。

  1. 创建一个新的ASP。NET MVCapplication. If you have installed theTelerik UI for ASP。NET MVCVisual Studio Extensions,为ASP创建一个Telerik UI。NET MVC应用程序。命名应用程序KendoGridBatchEditing.如果您决定不为ASP使用Telerik UI。NET MVC Visual Studio扩展,follow the steps from the介绍性的文章为ASP添加Telerik UI。NET MVCto the application.
  2. 添加一个新的实体框架数据模型.右键单击~ /模型文件夹中的解决方案资源管理器并选择添加新项目.选择数据>ADO。NET实体数据模型添加新项目对话框。命名模型Northwind.edmx并点击下一个.这开始了实体数据模型向导

    用户界面为ASP。NET MVCA new entity data model

  3. 选择从数据库生成选项并单击下一个.配置到Northwind数据库的连接。点击下一个

    用户界面为ASP。NET MVCChoosing the connection

  4. 选择产品表格来自您希望在模型中包括哪些数据库对象?.保留所有其他选项的默认设置。点击完成

    用户界面为ASP。NET MVCChoosing the Products table in the database objects

  5. 类中添加一个新类~ /模型文件夹中。下面的示例使用ProductViewModel的名字。

    公共类ProductViewModel{公共int ProductID {get;设置;} //需要ProductName属性。[必选]公共字符串ProductName {get;设置;} //为UnitsInStock属性使用Integer编辑器模板。[UIHint("Integer")] public short?UnitsInStock {get;设置;}}
  6. 开放HomeController.cs并添加一个新的操作方法,该方法将返回产品为JSON。网格将对该操作发出Ajax请求。

    public ActionResult Products_Read([DataSourceRequest]DataSourceRequest request) {// ToDataSourceResult使用IEnumerable和IQueryable。using (var northwind = new NorthwindEntities()) {IQueryable products = northwind. products;结果= products.ToDataSourceResult(请求);返回Json(结果);}}
  7. 添加一个新的操作方法HomeController.cs.它将负责保存新的数据项。命名方法Products_Create

    public ActionResult Products_Create([DataSourceRequest]DataSourceRequest request, [Bind(Prefix="models")]IEnumerable products){//将插入的实体保留在这里。用于稍后返回结果。var entities = new List();if (ModelState.IsValid) {using (var northwind = new NorthwindEntities()) {foreach (var product in products){//创建一个新的product实体,并从发布的ProductViewModel设置其属性。var实体=新产品{产品名称=产品。ProductName, unitsstock = product。unitsinstocks};//添加实体。northwind.Products.Add(实体);//存储实体以备以后使用。entities.Add(实体);} //在数据库中插入实体。 northwind.SaveChanges(); } } // Return the inserted entities. The Grid needs the generated ProductID. Also return any validation errors. return Json(entities.ToDataSourceResult(request, ModelState, product => new ProductViewModel { ProductID = product.ProductID, ProductName = product.ProductName, UnitsInStock = product.UnitsInStock })); }
  8. 添加一个新的操作方法HomeController.cs.它将负责保存更新的数据项。命名方法Products_Update

    public ActionResult Products_Update([DataSourceRequest]DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable products){//将更新的实体保存在这里。用于稍后返回结果。var entities = new List();if (ModelState.IsValid) {using (var northwind = new NorthwindEntities()) {foreach (var product in products){//创建一个新的product实体,并从发布的ProductViewModel设置其属性。var实体=新产品{ProductID =产品。ProductID, ProductName = product。ProductName, unitsstock = product。unitsinstocks};//存储实体以备以后使用。entities.Add(实体);//附加实体。northwind.Products.Attach(实体); // Change its state to Modified so Entity Framework can update the existing product instead of creating a new one. northwind.Entry(entity).State = EntityState.Modified; // Or use ObjectStateManager if using a previous version of Entity Framework. // northwind.ObjectStateManager.ChangeObjectState(entity, EntityState.Modified); } // Update the entities in the database. northwind.SaveChanges(); } } // Return the updated entities. Also return any validation errors. return Json(entities.ToDataSourceResult(request, ModelState, product => new ProductViewModel { ProductID = product.ProductID, ProductName = product.ProductName, UnitsInStock = product.UnitsInStock })); }
  9. 添加一个新的操作方法HomeController.cs.它将负责保存已删除的数据项。命名方法Products_Destroy

    public ActionResult Products_Destroy([DataSourceRequest]DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable products){//将在这里保留被破坏的实体。用于稍后返回结果。var entities = new List();if (ModelState.IsValid) {using (var northwind = new NorthwindEntities()) {foreach (var product in products){//创建一个新的product实体,并从发布的ProductViewModel设置其属性。var实体=新产品{ProductID =产品。ProductID, ProductName = product。ProductName, unitsstock = product。unitsinstocks};//存储实体以备以后使用。entities.Add(实体);//附加实体。northwind.Products.Attach(实体); // Delete the entity. northwind.Products.Remove(entity); // Or use DeleteObject if using a previous version of Entity Framework. // northwind.Products.DeleteObject(entity); } // Delete the entity in the database. northwind.SaveChanges(); } } // Return the destroyed entities. Also return any validation errors. return Json(entities.ToDataSourceResult(request, ModelState, product => new ProductViewModel { ProductID = product.ProductID, ProductName = product.ProductName, UnitsInStock = product.UnitsInStock })); }
  10. 在视图中,配置Grid以使用在前面步骤中创建的操作方法。的创建更新,摧毁动作方法必须返回一个包含修改或删除记录的集合,这将使DataSource能够应用相应的更改。的创建方法必须返回已创建记录的集合,其中包含已分配的ID字段。

    @(Html.Kendo(). grid () . name ("grid") . columns (columns => {columns. grid .)Bound(product => product. productid).Width(100);列。绑定(product => product. productname);列。Bound(product => product. unitsinstock).Width(250);列。命令(commands => {commands. destroy ();// destroy命令删除数据项。}) .Title(“命令”).Width (200);}) .ToolBar(toolbar => {toolbar. create (); // The "create" command adds new data items. toolbar.Save(); // The "save" command saves the changed data items. }) .Editable(editable => editable.Mode(GridEditMode.InCell)) // Use in-cell editing mode. .DataSource(dataSource => dataSource.Ajax() .Batch(true) // Enable batch updates. .Model(model => { model.Id(product => product.ProductID); // Specify the property which is the unique identifier of the model. model.Field(product => product.ProductID).Editable(false); // Make the ProductID property not editable. }) .Create(create => create.Action("Products_Create", "Home")) // Action method invoked when the user saves a new data item. .Read(read => read.Action("Products_Read", "Home")) // Action method invoked when the Grid needs data. .Update(update => update.Action("Products_Update", "Home")) // Action method invoked when the user saves an updated data item. .Destroy(destroy => destroy.Action("Products_Destroy", "Home")) // Action method invoked when the user removes a data item. ) .Pageable() )

另请参阅

在本文中
Baidu
map