Introduction to jQgrid

Introduction
Why waste time in developing lists /customizing Liferay OOB search container to display data in tabular format. On top of that more often then not we end up coding for sorting of columns, pagination and formatting some data depending on their values. Trirand has come up with a jQuery plugin called jQgrid. jQgrid supports all of such ease. It provides a nice-looking grid with built-in features such as sorting, editing, search, drill-down, tree lists, and more. It is based upon jQuery and integrates well with Liferay. The grid is dual-licensed under both the GPL and MIT licenses (just like

jQuery), so it can fit well into both commercial and open-source projects.

About jQgird
jQgrid is an Ajax-enabled JavaScript control that provides solutions for representing and manipulating tabular data on the web. Since the grid is a client-side solution loading data dynamically through Ajax callbacks, it can be integrated with any server-side technology, including PHP, ASP, Java Servlets, JSP, ColdFusion, andPerl.

jqGrid uses a jQuery Java Script Library and is written as plugin for that package.




Salient features of jQGrid
jQGrid supports most of the basic grid functionalities as well as has some distinct features. Listed below are a few noted features:
  • pagination.
  • resizable columns.
  • sorting various types of data.
  • event handlers.
  • auto loading data while scrolling.
  • working with local data.
  • Seamless integration with any server side solution such as ASP, .net, PHP and perl.
  • Cross browser. Supports for IE 6.0+, FireFox 2.0+, Safari 3.0+, Opera 9.2+ and Google Chrome.
  • Multilanguage support (i18n). Currently jqGrid supports more than 20 languages.
  • Support for XML, JSON and arrays as data sources. Another great feature is the possibility to define your own custom data type.
  • SubGrids. Using a SubGrid is the easiest method for displaying data from child records.
  • SubGrid as Grid. In this alternative to a subGrid, we use the subGrid functions of the main grid to create not a subGrid, but another grid, with all of the power and capacity of the main grid but appearing, as before, under the “parent” record with the same ability to reveal and hide it.
  • The developer can define you own custom formatter
  • Inline editing.
  • supporting of text, text area, check box, select, image, button types
  • client side validation of the entered data
  • searching and filtering
  • advanced searching with criteria defined from user
  • Treegrid supports both the Nested Set model and the Adjacency model
  • jqGrid is able to import or export the entire grid configuration to another file format:
  • support of xml, json, xmlstring, jsonstring formats



Other advantages of jQgrid are :




Installation
Steps to for installation can be found here.

Example
A step by step guide to creating a jQgrid can be seen here.

Comments

Post a Comment

Popular posts from this blog

jQgrid reload with new data

To reload a jQGrid with fresh data you need to set the data parameter on the grid and invoke reload on it. jQuery("#promotionsGrid").setGridParam({ 'data': newData}).trigger("reloadGrid"); Here newData is a JavaScript array with which I need to re-load the grid. The important thing here is that I had to place this statement just before the grid initialization code even though the reload was expected on change event of a text box. Without that there was simply no effect on my grid!
Read more

Rich Client based UI technologies- A Comparison of Thick Client UI tools

Rich Client v/s Thin Client Software developers face many difficult decisions when building new applications, not the least of which is graphical user interface. There are various graphical user interface technologies used, but broadly they can be classified as Rich Client User interfaces and the thin client or web based user interfaces. To understand them better let us look at the history of rich and thin clients. While the Rich client GUI applications would support high quality end-user experience with features such a drag-and-drop, perspectives, customization, high speed local processing; it has had a traditional disadvantage of high deployment and upgrade costs. It was becoming highly difficult and costly to deploy and upgrade these applications. Then came the thin clients or the Web based applications. Thin clients solved many of the deployment and upgrade problems, but that was not without a cost, the cost was in terms of functionality and capability. Thin clients, based on...
Read more