This is an (ongoing) compilation of some Kendo UI features (mainly GRID related) that have helped me save time (over doing it with jQuery UI)

  1. Offline Data Persistence
  2. InLine Grid Editing

Offline Persistence

Your kendo grid still displays data in case of a missing network connection to the datasource (using the offlineStorage option to enable offline storage). The DataSource uses this value as a key when saving and loading its state. By default, the Kendo UI DataSource uses the localStorage option to persist its offline state.

OfflineStorage

 

In Line Editing

A common scenario is to toggle a grid cell into edit mode by simply clicking on the Edit row button – and update the data inside the cell. This is trivial to accomplish in the kendo grid by simply adding the .Editable property to the grid

<%: Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()
        .Name("grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.ProductName);
            columns.Bound(p => p.UnitPrice).Width(120);
            columns.Bound(p => p.UnitsInStock).Width(120);
            columns.Bound(p => p.Discontinued).Width(120);
            columns.Command(command => { command.Edit(); command.Destroy(); }).Width(250);
        }).Editable(editable => editable.Mode(GridEditMode.InLine))

Excel style filtering

Anuj holds professional certifications in Google Cloud, AWS as well as certifications in Docker and App Performance Tools such as New Relic. He specializes in Cloud Security, Data Encryption and Container Technologies.

Initial Consultation

Anuj Varma – who has written posts on Anuj Varma, Hands-On Technology Architect, Clean Air Activist.

 Twitter Linkedin