Three ways to get started with KendoUI Grids on ASP.NET MVC

— Disclaimer: I do not work for KendoUI (Telerik) and I am not getting anything in return for this entry… I just like the library ­čśë

Over the past months I have been evaluating the KendoUI library and using it on my pet projects. I really like it, is evolving very fast and has good community around it.

KendoUI Grids are very flexible and can be used in many different ways. In this post I will show how you can get started with KendoUI grids on your ASP.NET MVC Projects., I will show you three different ways I have used them, which include Creating the Grid starting from a basic ASP.NET MVC List Template, Creating the grid over an empty div with a remote data source, and finally, how to create a grid using KendoUI templates.

These walk-troughs will cover most of the basics but are only intended to get you started; I encourage you to go to and view all other options/configurations/methods available.

Download the Code

Method 1: Grid over Existing HTML

In this example, we start from the MVC List Template and convert it to a fully functional grid with pagination and sorting.

Method 2: Grid over an Empty Div

In this example, we start over an empty div and use a remote data source. We modify our controller to provide the required Json. The result is a grid that allows paging, sorting, grouping and filtering.

Method 3: Grid Using Templates

We start from the MVC Template List, and convert it to a Grid that uses remote data source and is fully functional. This is my prefer method because it provides  simplicity when modifying the grid presentation, and has the power of the remote datasource.

Author: ricardocovo

Senior Software Architect/Developer with extensive experience in web related technologies.

11 thoughts on “Three ways to get started with KendoUI Grids on ASP.NET MVC”

  1. Superb. Thanks alot. i am feeling quite confident about Kendo now. ­čÖé
    Thanks Again.
    Your videos are awesome, even better then what kendo has provided.

  2. Gracias Ricardo, una ayuda realmente invaluable, para todos aquellos que se esten adentrando en este framework muy prometedor

  3. In your DevSample you have the wrong field on Model { field: “Model”, title: “MODEL” }
    Also you should add filterable: false to Action column.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: