R2 2018 Release is here – now with modern UI for chatbots and more! See what’s new!
Change Theme

SASS Themes

    LESS Themes

      SASS Theme Builder

      Create new or customize SASS themes
      Launch Theme Builder

      Editing custom editor


      In numerous scenarios there is a requirement to not only visualize data in a table structure, but also to have the ability to manipulate it and save the changes.

      The MVC grid wrapper supports CRUD data editing operations via a simple configuration of its data source. All you have to do to enable its data editing capabilities is to:

      • set the grid's editable configuration option:
        .Editable(editable => editable.Mode(GridEditMode.InCell))
      • declare field definitions through the Model configurator
      • configure the DataSource for performing CRUD data operations defining its Read, Create, Update and Destroy attributes

      If you want to enable new records insertion, you can do that by enabling the relevant option in the grid toolbar. For deleting items you need to include a delete command column.

      In this demo you can see how to further customize the editor by setting a custom editor (Html.Kendo().DropDownListFor() MVC helper in this case) as a grid column editor by specifying the Category column's editor field, i.e.

      .Columns(columns =>  { …   
      columns.Bound(p => p.Category).ClientTemplate("#=Category.CategoryName#");

      Specify a default value that will be used initially when creating an item:

      model.Field(p => p.Category).DefaultValue(ViewData["defaultCategory"] as Kendo.Mvc.Examples.Models.CategoryViewModel);

      For more details about the editing capabilities of the MVC Grid see the help article here.
      More details for the editor template can be found here

      ASP.NET MVC source

      Also available for:

      • editing_custom.cshtml
      • Editing_CustomController.cs
      • ProductService.cs
      • ClientCategory.cshtml
      • ProductViewModel.cs

      Support & learning resources

      Grid for other technologies