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

      Inline editing


      A common scenario is to toggle a grid cell into edit mode by simply clicking on the Edit row button, update the data inside the cell and save/discard the changes using the Update/Cancel buttons.

      This demo shows how inline editing can be achieved using the data operations (create, update and destroy) of the Telerik fro ASP.NET Core Grid.

      All you have to do to enable the inline editing capabilities of the ASP.NET Core Grid is:

      • Set: .Editable(editable => editable.Mode(GridEditMode.InLine))
      • To enable insertion of new records add the New Record button on the toolbar by adding: .ToolBar(toolbar => toolbar.Create())
      • To enable the Edit and Delete commands on each row, insert a new column: columns.Command(command => { command.Edit(); command.Destroy(); });
      • Define the Create, Read, Update and Destroy action methods to the DataSource declaration. These methods are responsible for the data items manipulation.
      • Specify a unique field in the Model as the DataSource Model Id

      More about the Telerik Grid for ASP.NET Core Inline Editing

      More about the Telerik Grid for ASP.NET Core

      ASP.NET Core source

      Also available for:

      • editing_inline.cshtml
      • Editing_InlineController.cs
      • ProductService.cs
      • ProductViewModel.cs

      Support & learning resources

      Grid for other technologies