One of the largest projects we currently have going on at HardinDD is the transition of the CRE Enterprise and Visual Manager dashboard platforms (which we work on in partner with the corporate real estate firm Fischer and Company in Dallas, TX) from Adobe Flex into a true web application. A core component of the dashboard system, which manages varying sizes of property record datasets for real estate companies, is an Excel spreadsheet-like view of property data which clients may use to edit, sort, or filter on property records.
Some of the most important features we needed for our spreadsheet view were the ability to sort on columns, reload the data displayed on the grid (without actually reloading the web page), and customize the order and size of columns. The SlickGrid API provides the ability to do all of these things and more, and they’re almost all fully customizable. For example, SlickGrid has a built in sorting capability on data currently in the view of the graph, but because we use a server-side paging script to load only a subset of records for large datasets, we chose to override this functionality. Instead, we use AJAX to load the paged records, reset the data displayed on the grid dynamically, and SlickGrid handles the rest, all in a matter of seconds. There’s also no limit to the number of grids you can display at once; we often have 3 to 10 tabbed grids available to click through on a single page.
Though it has a bit of learning curve, once you’re familiar with the library, you’ll be amazed at how powerful and flexible this grid system is. There are a number of working examples available that demonstrate the use of SlickGrid, and the StackOverflow community is active in discussion and providing answers to questions about SlickGrid’s use. If you’re looking for a quick and elegant solution to creating a data grid for your website, we highly recommend giving SlickGrid a try.