jQuery : jQGrig : Make jQGrid responsive

There might be other better ways to make jQGrid responsive. This is an explicit way to do that.

/**
 * Binding function resizeGrid to resize and load event of window
 *
 * @author Shiva Bhusal
 */

jQuery(window).bind('resize', function () {
  resizeGrid('#bids-table', '#bids');
});
jQuery(window).bind('load', function () {
  resizeGrid('#bids-table', '#bids');
});

 * This function resizes the width of jQGrid, makes jqgrid responsive
 *
 * @param responsiveParentId Id of parent that is responsive, by default it will take body
 * @param idOfTable Id of the table that needs to be responsive
 *
 * @author Shiva Bhusal
 */

function resizeGrid(idOfTable, responsiveParentId) {
   // pageWidth imports its width from responsiveParentId, Default parent is BODY
   responsiveParentId = responsiveParentId || 'body';
   var pageWidth = $(responsiveParentId).width();
   $(idOfTable).setGridWidth(pageWidth);

}

4 thoughts on “jQuery : jQGrig : Make jQGrid responsive

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s