Jquery – Does jQuery jqGrid support horizontal scroll bar and frozen columns

horizontal-scrollingjqgridjquery

I have a jqGrid with a lot of columns, and it shows up like this when the sum of the column widths are bigger than the fixed width container:

enter image description here

Instead of having a horizontal scroll bar if the width of the grid is too big.

How can I get a horizontal scroll bar for jQgrid so there is a fixed max size of the grid and if I add more columns it will simply scroll?

Also, assuming this is possible, can you freeze the first few columns?

Best Answer

Probably you use forceFit:true jqGrid option. First of all you should set forceFit:false or use shrinkToFit:false. After that you can either use width option of jqGrid or use setGridWidth method to set grid width. You will have grid where the column header correspond to the width property of the column and the grid will have horizontal scrollbar.

UPDATED: Try to set shrinkToFit:false and width:600 (for example) and see the results.

After setting only shrinkToFit:false you can see that the grid will have the horizontal scroll bar. You will see it even the grid is small enough to be displayed without the scrolling. It is a bug which I posted here together with the corresponding bug fix. The fix is included in the the code on the GitHub, but not included in the jqGrid 3.8.2. The next jqGrid release will have the fix. Nevertheless for your purpose the wrong width is not important because you will/can set the width of grid explicitly.