How to resize jqGrid on splitter drag

Question

I have some problems with implementing jqGrid with jQuery layouts. The problem is with resizing the grid on browser window resize. The height is working correctly but my problem is width. The grid width won't refresh sometimes. Also, if I close the left pane, the grid doesn't recognize the new width and it keeps the old.

To be short, I need th egrid width to be 100% of window width.

I tried to implement this code to see where my problem was, but the same thing happened. Here are pictures of my problem:

Basic load and Splitter activated.

Answer 1

something like:

$(window).bind('resize', function() {
    $("#jqgrid").setGridWidth($(window).width());
}).trigger('resize');

Answer 2

The value of 100% is not supported for jqGrid width. To achieve the desired result you need to use proper callbacks of jQuery layouts and setGridWidth method:

$('#gridId').jqGrid('setGridWidth', 600);

You can find some samples here: Resize jqGrid when browser is resized?