share
Stack OverflowjQuery Grid Recommendations
[+383] [27] Wilco
[2008-10-01 18:32:18]
[ javascript jquery jquery-plugins grid ]
[ http://stackoverflow.com/questions/159025/jquery-grid-recommendations ] [DELETED]

What are the most recommended jQuery grid plugins out there? I've been messing around with Flexigrid which seems to be fairly decent. Are there any other noteworthy ones out there I should be looking at?

What is disappointing is that even though all the grids are quite well-featured, none of them support browser history, nor linking to a specific view of the grid by URL. - Vojtěch
(2) @Vojtěch the wonderful thing about github and opensource, is if you want it you can add it :) - Toby Allen
[+288] [2008-10-01 20:39:21] mistrmark [ACCEPTED]

I am also looking for a grid to use in a jQuery project I am working on. Below I have summarized my findings so far.

The best entries in my opinion are Flexigrid and jQuery Grid (1st & 2nd in list). The others are included for completeness.

I like the jQuery Grid (#2 above) better than Flexigrid mostly because it supports editable cells, and has very good documentation and samples on the website.


(1) Is jQuery Grid free? I thought you need to pay for it? - Jeff
(4) I'd suggest giving a look at jqGrid (not to be confused with jqGridView), it's about the best option currently for a grid for jQuery. The latest version works well with jQueryUI themes as well trirand.com/jqgridwiki/doku.php - Tracker1
(4) @Jeffery you only have to pay for the ASP.NET or PHP grid generation modules. jqGrid javascript library is free. - Erik
Does anybody have any idea which of these libraries is the fastest, especially on IE6 (I'm sorry, but this is my target browser)? - geff_chang
(34) I added SlickGrid, imho nothing comes close to it performance wise - Sam Saffron
+1 to Sam for adding SlickGrid. - Daniel Earwicker
I checked out both jQuery Grid and SlickGrid. I chose jQuery Grid because SlickGrid's virtual rendering is ugly when dragging the scroll bar up and down. It is otherwise seamless when you use the up and down arrows, or your scroll wheel. jQuery Grid does not have this issue. Tested this in IE7, Chrome, and FF3.6 - John
@john jqGrid has the same issue - the rows that haven't been rendered yet will first show up as blank. Unlike SlickGrid though, this happens when navigating with the keyboard and scrolling a page at a time via the scrollbar as well. - Tin
The Data Explorer uses SlickGrid. It's wicked fast, not to mention slick. - Matt Ball
(6) SlickGrid seems like it should be pretty good, but the almost complete lack of documentation for something as complicated as it is makes it a very difficult choice. - Pointy
(4) Should add DataTables: datatables.net/index - MattMitchell
Or Just use Dijit ;) - SalmanPK
(1) @Graphain I added DataTables :) - Mottie
Doesn't support direction:rtl :( - Elad Katz
I am confused! I clicked on "jQuery Grid" and got directed to a form builder. Are they one and the same? - Prisoner ZERO
1
[+63] [2009-08-17 13:53:54] Hamza

I tried jQuery Grid and Flexigrid. They are good, but Flexigrid doesn't have enough examples, and jQuery Grid is a bit heavy.

Here are some other jQuery Grid plugins:

Personally I prefer jQueryGrid (because of its features), and Datatable (because of its simplicity).

Note: jQuery UI [2] has plans for a grid plugin: GridTable [3].

[1] https://github.com/mleibman/SlickGrid
[2] http://en.wikipedia.org/wiki/JQuery_UI
[3] http://jqueryui.pbworks.com/GridTable

SlickGrid is now hosted at github.com/mleibman/SlickGrid - Tin
(4) +1 for DataTables - MattMitchell
(2) +1 For datatables - more features then jquery grid and faster. - ppumkin
(2) +1 for datatables - love it - mutex
(1) +1 for datatables :) - Philar
+1 for datatables - Randy
+1 for datatables - Jean-Philippe Leclerc
+1 for datatables - Jannis M
2
[+30] [2010-01-05 18:04:52] retro

The only real implementation of grids for jQuery is http://github.com/mleibman/SlickGrid/. Everything else are nicely styled tables with additional options.

Edit: It seems that jqGrid [1] also has loading while scrolling feature from version 3.6, which is IMHO [2] the crucial feature for grid implementations.

[1] http://www.trirand.com/jqgridwiki/doku.php?id=start
[2] http://en.wiktionary.org/wiki/IMHO

looks really awesome. - Luke Lowrey
(2) +1 Having started looking into this over the last week or so, I have to agree with this. Although SlickGrid is hardly documented, it is the only one I've seen so far that has a really good underlying model. I found I could get a working grid that scrolls through 10,000 rows, no need for stupid "paging" buttons - it just automatically requests short batches of rows from the server on demand as you scroll. Looks very easy to plug in editors. - Daniel Earwicker
jqGrid also has the scroll feature and has done a while. - Dave
(3) -1 Too little documentation to be considered the only real implementation for jQuery. - Justin
+1 looks really nice and well implemented, I am jqgrid fan but I think I may convert - Anurag Uniyal
3
[+22] [2008-10-01 18:38:14] Elijah Manor

Personally I like the Flexigrid [1]. It is professional looking and I like the feature set. I have seen others, but I think they don't look all that good or their features are so-so.

I did a blog entry [2] on how to use C# 3.5 with the Flexigrid using LINQ to Reflection.

Some other grids that you might want to check out are

[1] http://flexigrid.info/
[2] http://webdevdotnet.blogspot.com/2008/07/flexigrid.html
[3] http://www.webresourcesdepot.com/amazing-jquery-grid-plugin-jqgrid/
[4] http://reconstrukt.com/ingrid/

4
[+22] [2010-04-25 10:16:48] BoBo
5
[+18] [2011-02-16 11:59:14] Ashraf

The jQuery UI [1] team announced to have their own jQuery grid plug-in ;-) Have a look in Unleash The Grid [2]. As of Feb 2012 this is still in development.

[1] http://en.wikipedia.org/wiki/JQuery_UI
[2] http://blog.jqueryui.com/2011/02/unleash-the-grid/

(1) That is very cool :) - Alfred
(3) this is very cool, but not something to pick up rigth now ( - alexanderb
(1) Ahh, fantastic. - dmackerman
6
[+18] [2011-11-29 15:29:07] Cory House

Checkout KendoUI [1]. It offers a powerful grid.

[1] http://demos.kendoui.com/grid/virtualization-local-data.html

7
[+12] [2010-01-27 21:55:22] Tracker1

Honestly I think jqGrid [1] is currently the best option, as of the latest version. It's pretty easy to inject a form outside of the jqGrid stuff, and the addons are well broken out, as is the localization configuration. The current version works well for pre-manipulation of an XHR request before loading it into the grid itself.

I was using it in a project back in March (2009) and there were some frustrations. All of my prior frustrations have been resolved, save for one. It doesn't automagically size itself to it's parent jquery-ui container, this is pretty easily resolved with a call to a sizing method via the windows resize events, and when the page first loads. The fact that it requires a separate "pager" tag in the markup seems a bit odd as well.

It doesn't support multi-row results (haven't seen any grids that really do), but it does support a subgrid (similar functionality) which can be useful. Most of the other grids listed are either no longer maintained and are no longer valid options. I know this question is well over a year old, which is why I am making this answer/post.

[1] http://www.trirand.com/jqgridwiki/doku.php

8
[+9] [2009-06-12 20:08:38] James Hackett

After trying jqGrid and Ingrid I have found DataTables to be my grid of choice. It is clean, easy to customize and has good documentation.

jqGrid definitely has the most features but there wasn't an easy way to customize the UI since all the html formatting is intertwined with the logic. Also there is inconsistent naming conventions and methodology when setting up the config. For example, most variable names are written in all lowercase letters but a few use camelCase (this cost me about an hour of my life).

When using Ingrid I was experiencing some odd rendering issues. You couldn't put it inside of a div that is set to position relative because some elements of the grid are rendered against the window size and some are rendered against its parent. That along with some other little quirks made it not seem ready for prime time.


As @Loki pointed out on another comment, the most recent jqGrid version supports jQueryUI themes which can be customized - Marcus
9
[+9] [2010-06-11 16:34:24] Dänu

I hope it's not too much self advertising, but I found the above solutions (which are really great) hard to fit into my design. So I build my own, which is, IMHO, easier to style according to your wishes - I recently released it to the masses. It's not exactly a grid (it can be one) but well a view.

MicroView: Check it out here [1].

[1] http://codebrewery.blogspot.com/p/microview.html

I liked your MicroView its cool - Ramji
Thanks, I wanted to try a different approach (not the table one obviously). Next thing to come is a filter. But I'm pretty busy at work at the moment. - Dänu
Nice! I'll definitely be checking this out. - Wilco
So much lighter and more customizable than any of the other options! Thanks! - neezer
10
[+6] [2009-04-09 10:18:39] Ian

I've been using jqGrid, and whilst it's reasonably easy to use, easy to setup and intuitive, it's lacking a very basic feature - support for CSS styling (columns, rows or cells), which to me is a glaring oversight, and means I'm looking for a better alternative.

Does Flexigrid offer this?


(2) FYI:The latest version supports jQueryUI themes which can be customized - HitLikeAHammer
We've been using the themes - works nicely. - Marcus
11
[+4] [2010-03-16 04:10:26] Aaron

If you are using ASP.NET MVC Telerik has a free jQuery grid [1] control.

[1] http://demos.telerik.com/aspnet-mvc/grid

Thanks! I thought that it had to be purchased, but it's free for internal use applications! - Alex
12
[+4] [2010-12-06 20:52:31] Nicola Peluchetti

I've always used dataTables [1], and I still find it very easy to use. I think that dataTables is perfect for "showing" data (filtering...), but it can be used in a grid-like fashion if combined with jEditable as shown in this DataTables editing example [2].

The best option for datatable is to also use the Key Tables plugin and have a truly "Excel-like" experience as shown in KeyTable editing example [3].

[1] http://datatables.net
[2] http://datatables.net/examples/api/editable.html
[3] http://www.datatables.net/release-datatables/extras/KeyTable/editing.html

13
[+3] [2010-06-04 13:32:35] Gabriel Lozano-Moran

By the way the Telerik Extensions for ASP.NET MVC is only free for non-commercial use or for OSS projects. For commercial use you need a developer license which are priced 999$/license.


14
[+3] [2010-08-04 17:45:46] Abid Omar

Check out tQuery [1].

It's not a grid, but it has similar features like table sorting, filtering, cell editing, pagination, many effects and you can also fully customize the skin. It's not free either, and it costs a few $ to buy me a coffee ;)

*Disclaimer: This is my script.

[1] http://codecanyon.net/item/tquery-dynamic-tables/89478?ref=omarabid

15
[+3] [2011-02-12 10:01:17] vk_muse

I worked with jqGrid [1]. It is pretty cool and has a lot of features. It is much more powerful than Flexigrid. The drawback is that it is hard to customize the user interface (such as it depends on jQuery theme - but it is related to all jQuery UI [2] widgets).

Data Tables [3] is also a good option (cool and simple in use).

[1] http://www.trirand.com/jqgridwiki/doku.php?id=start
[2] http://en.wikipedia.org/wiki/JQuery_UI
[3] http://www.datatables.net/

16
[+2] [2008-10-01 20:49:44] Wilco

So far Flexigirid seems to be the most aesthetically pleasing and functional option (rare to find both in one offering). The only downside I've found so far is that it doesn't offer all of its functionality for every data source it supports (most of its more advanced features like sorting, pagination, etc. seem to only work when it's pulling data via JSON+AJAX and not when it's working with a standard HTML table).


17
[+2] [2010-08-04 17:59:55] Adam Rackis

I'm surprised nobody has mentioned Ext [1]. Their grid is tremendous, and the API is very intuitive.

[1] http://en.wikipedia.org/wiki/Ext_%28JavaScript_library%29

(14) It's a jQuery question. - Daniel Earwicker
(1) True, but ExtJS can sit on jQuery or Prototype or it's own core. - jarofclay
18
[+2] [2011-05-07 04:33:28] pyccki

I'm waiting for jQuery UI Grid, which should be coming anytime soon.

jQuery UI Grid [1]

[1] http://wiki.jqueryui.com/w/page/34246941/Grid

19
[+1] [2008-10-01 19:34:22] James Curran

Flexigrid seems nice, however, it (as well as jGrid) seems to alter the underlying HTML so that it will no longer work with TableDnD [1] (if you want to drag rows around). That led me to write my own simplistic plugin, which I plan on sharing with the world shortly.

[1] http://www.isocra.com/2008/02/table-drag-and-drop-jquery-plugin/

20
[+1] [2009-03-31 19:54:01] MattH

Yahoo User Interface datatable and datasource is a much more robust solution. I've used jqGrid and DataTable...YUI grid wins hands down.


21
[+1] [2010-01-04 08:11:45] Tubo.Rim

I believe flexible grid and jqGrid [1] are outstanding in term of jQuery. I recommend the latter, because it seems that the author of flexible grid stopped upgrading any longer. I am also using Sigma grid, which is not built on jQuery, but it is compatible with jQuery. Most important, it could be used freely under the LGPL license.

[1] http://www.trirand.com/jqgridwiki/doku.php?id=start

jqGrid and DataTables are by far the tops at this time. I personally love the cleanliness of DataTables, which when used with jEditable is exactly and all that people need.. - Logarhythm
Picking the jqGrid for one of my projects was by far the worst decision ever made in that project. The code is a unmaintainable mess. It's scary even to think how much money this lousy decision has cost me. - Roman
22
[+1] [2010-03-16 04:04:11] Sonor

I have tried Flexigrid. But it seems that updates are no longer provided. I am using Sigma grid [1], which is not a jQuery plugin, but it's also an open source one. It can work well with jQuery.

[1] http://www.sigmawidgets.com/products/sigma_grid2/

23
[0] [2010-04-14 20:03:34] Josh

I'll have to second Sonor. The grid with Telerik stuff is nice, efficient and supported. If you're doing anything that is commercial I'd use that.


24
[0] [2010-05-06 15:14:38] farinspace

a simple jQuery Scrollable Table Plugin [1]

[1] http://farinspace.com/jquery-scrollable-table-plugin/

25
[0] [2011-01-15 13:19:00] sch

Try the jQuery grid [1] from iX Framework [2]. It has a grid with grouping, filtering, sorting, column show / hide. And it includes a charting component, form with validation, windows and a lot of field types.

[1] http://www.intelligentexpert.net
[2] http://en.wikipedia.org/wiki/IX_Framework

26
[0] [2011-10-26 20:03:05] ra00l

I'd vote for flexigrid too. It's fast an lightweight.

Maybe you can also have a look at www.flexigrid-asp.net

It's an ASP.NET customized version, with documentation and lots of examples.


27