fixing column headers while scrolling - jqgrid

Question

If my grid data scrolls over the current window, is it possible to freeze the column headers while scrolling the data so that column headers are always visible(like in excel). I

Answer 1

This is built into jqgrid. However, in order to use this functionality, you will want to resize the grid itself to fit the window, and then have it resize whenever the window resizes. This will allow scrolling to happen within the grid itself, not within the whole document. See below:

$(window).resize(function () {
  resizeGrid();
});

$(window).load(function() {
  resizeGrid();
});

function resizeGrid() {
  var heightPadding = 200; // or whatever you want it to be
  var widthPadding = 40; // or whatever you want it to be
  $('#grid').setGridHeight($(window).height() - heightPadding);
  $('#grid').setGridWidth($(window).width() - widthPadding);
}