Have an amazing solution built in RAD Studio? Let us know. Looking for discounts? Visit our Special Offers page!
+ Customer Portal
News

Using jqGrid with ASP.NET MVC: Finally, A Solution

By
April 17, 2009

Author: Craig Stuntz

Having introduced jqGrid and written LINQ extension methods to make supplying data to the grid easy, we’re now ready to put together a demo application. The solution I’m going to build demonstrates sorting and paging. In a future post, I will enhance it to demonstrate search, formatting, and editing data. I’ve made the demo application available for download, but be advised that I intend to update it in the next few days; it’s currently a work in progress.

Rather than make you set up the Northwind database, I’ve written a quick, mock repository which supplies random data for the application. But the data persists for the lifetime of the app, so I’ll be able to demonstrate sorting, paging, etc. This way you can just run the application, without having to set up SQL Server.

So let’s write some code display a grid.

The data I’m going to display in the grid is a fairly useless type:

We need two actions. The first will display the page containing the grid. The second supplies data for one page of the grid. Remember, the grid can page through large datasets. It will only request one page of data at a time.

The first action simply returns a view containing the HTML table which will eventually become the grid. It doesn’t need a model, because the grid will request its data asynchronously. The second action handles the data requested by the grid.

In order to make this work, we need HTML elements for the grid and its pager in the view, along with a reference to the JavaScript which will turn those elements into the grid.