jQuery Grid Plugin

Building web-apps using the new MVC-framework for ASP.NET can be challenging if you need to build the boiler-plate code for the SMART controls that come standard with ASP.NET, like the GridView, ListView, etc.

However, jQuery's (see jQuery in Action for an excellent resource) plug-in, jqGrid, makes this easy. Although it can be time-consuming to setup the template that specifies the requirements for the grid, it is easy to duplicate once you have it set up.

So basically you specify the columns you want to see in the grid, specify the format for each column, and it will perform an Ajax call for built-in sorting, search, and CRUD functions.

Some of the supported features:

  • paging functions
  • add, edit, delete & search records
  • accepts XML, JSON, array or user data as input
  • multiple selection of rows
  • sub grid & grid details (great feature!)
  • UI datepicker integration
  • & more…

Of course you need to specify the server-side-code to handle these events. Pass a DTO back, JSON serialized (some other formats are supported), and it will bind the DTO's properties to the grid.

Minimum Requirements : jQuery 1.1.4+
Browser Compatibility: All Major Browsers
Website : http://www.trirand.com/blog/
Demo : http://trirand.com/jqgrid/jqgrid.html
Downloads : http://www.trirand.com/blog/?page_id=6


The number of lines of HTML you need to write yourself for this to work is just two lines:

  1. One<TABLE> tag
  2. One <DIV> tag for paging if desired

That's it, 2 lines, one for the body and one for the paging controls that also contains the controls for the CRUD functions.

Have been using it in a in-house web-development project for a UI/Process intensive CRM app with users who's machines are 10 years old, about 785MB RAM machines with an x86 Family 6 Model CPU, and it performs great. We are running it mainly on FireFox (the gold standard browser engine :-), and have tested it on IE8, Chrome and Safari 3, on Windows 2000 to XP and Vista platforms with no issues.

Print | posted @ Thursday, July 2, 2009 11:52 AM

Comments on this entry:

Gravatar # re: jQuery Grid Plugin
by Dog at 9/7/2009 3:03 PM

It doesnt have editing etc enabled yet, but the basic functionality is there and hopefully more to come but check out http://mvccrud.codeplex.com for a much more automated approach will save much time.
Gravatar # re: jQuery Grid Plugin
by Andrew at 11/24/2009 12:48 PM

I am having trouble getting jQgrid to load data from the controller when I deploy to IIS 6. I have tried '/Home/GetGridData/', ResolveUrl, and Url.Action. Is there a solution for this? Thanks
Post A Comment