This article is about developing a jQuery grid component. At Gislen Software we develop advanced user interfaces. If you develop web applications it is always tricky to find suitable controls. The available commercial or free controls may have limitations and there are a lot of them. It’s easy to just use the grid view control that Microsoft provides in asp.net but to really deliver great responsive websites, you may sometimes need to develop a custom control.
Before developing the control I identified what was required from the custom grid control that is important to our application development
2. Rich UI
4. Reduce load on the server (Render essential controls on the server and do the rest on the browser)
5. Cross-browser support
7. Easy maintenance
To get a faster response from the server, I decided to render only essential controls and pull the data as JSON objects. This would also free the server from rendering the grid control on the server.
We also designed our grid to load and render data on demand. It even fetches data from the server when the user scrolls down in the grid. The grid sends a request to the server for a chunk of data and appends it to the end of the grid and will continue doing the same until the grid is scrolled to the bottom of the data set.
The Grid also supports inline editing and the editing behaviour for each column cell can be configured.
I initially developed the grid for an in-house product. But then we got a customer project where the same functionality was required and with just some minor tweaking I was able to put it to use in the customer project as well.
This was a very good experience, and I am really looking forward to developing more controls.
Senior Software Engineer