1

I have the main grid set to autowidth: true, but how do I do the same with the subgrid so that it is the same width as the parent, and the columns are all relative/variable/percentage widths?

CaffGeek
  • 21,856
  • 17
  • 100
  • 184
  • 1
    Could you post more code which shows how you use jqGrid and how you create subgrid? Do you use [subgrid as grid](http://www.trirand.com/jqgridwiki/doku.php?id=wiki:subgrid_as_grid) or you use [old style subgrids](http://www.trirand.com/jqgridwiki/doku.php?id=wiki:subgrid) using `subGridModel`? Which `datatype` you use for main grid and for subgrid? Do you load all data for grid and subgrid at once or load it on expanding? – Oleg May 01 '13 at 18:32
  • I'm using the old style, I never saw the new way. I'll try to change my code over. Thanks. – CaffGeek May 01 '13 at 19:05
  • You are welcome! usage of grid as subgrid is really easy. What one need is just implementing `subGridRowExpanded` callback. jqGrid create new row for subgrid and create div for the right (main) part of the subgrid. Then it call `subGridRowExpanded` callback. So you can create inside the div *any* HTML data (see the demo from [the answer](http://stackoverflow.com/a/4115481/315935)). If you append empty `` element in the div you can create jqGrid inside. So all is very simple and very flexible. I recommend you only usage `idPrefix` in subgrid to prevent id duplicates.
    – Oleg May 01 '13 at 19:18

2 Answers2

1

The width of the subGrid will be set when it is initalized, and as it doesn't contain any data when it is built it will be the size of the total column widths. You can get around this by setting the width of the grid each time you load the subgrid

$('#ParentGridName, #SubGridName').jqGrid('setGridWidth', $('#IdOfHTMLElementHoldingGrids').width(), true);

This will synch up both the parent and child grid sizes. If you are worried about the window being re-sized as well you can call this as part of an event handler.

Ex.

window.onresize = function () { resizePageGrids() }
Mark
  • 3,123
  • 4
  • 20
  • 31
  • For now I've modified the css `.tablediv>table { width: 100%; }`, I dislike jqGrid the more I use it. Why are the colModel, and subGridModel two completely different data structures? ARGH! – CaffGeek May 01 '13 at 14:14
1

You wrote in the comment to other answer the question

Why are the colModel, and subGridModel two completely different data structures?

Indirectly you answered yourself on your main question. The usage of old style subgrids (see "Advanced" / "Subgrid" on the official jqGrid demo) have too many restrictions. If you would use subgrid as grid (see "Advanced" / "Grid as Subgrid" on the the same jqGrid demo) you can create the same results, but you have much more flexibility. You can use for example formatters (inclusive custom formatters) use cellattr and rowattr callbacks, use autowidth: true option in the subgrid and so on. You have exactly the same set of possibilities as in the main grid. If you define some common callbacks in $.jgrid.defaults you can share the code of callbacks of subgrid and the main grid...

I can continue with the list of advantages of the usage of Grid as Subgrid. My short advise: use always only the feature.

Oleg
  • 220,925
  • 34
  • 403
  • 798