free-jqgrid / jqGrid

jQuery grid plugin
https://github.com/free-jqgrid/jqGrid
Other
479 stars 195 forks source link

Minimal grid width issue #340

Open cosinus90 opened 7 years ago

cosinus90 commented 7 years ago

When column are auto-resized and If columns happen to be shorter then grid caption and navigation block - caption get wrapped and navigation get cut. Here is the code https://codepen.io/zzmaster/embed/pwvWwV

clipboard01

It would be great if there will be minimal width calculated from width of cation and navigation and auto resize should enlarge columns proportionally.

OlegKi commented 7 years ago

Wrapping of caption is practical thing in many scenarios. Thus one can't use width of cation as minimal width of the grid in the common case.

One can get good results by adding simple CSS rules like

.ui-jqgrid,
.ui-jqgrid>.ui-jqgrid-view,
.ui-jqgrid>.ui-jqgrid-view>.ui-jqgrid-titlebar,
.ui-jqgrid>.ui-jqgrid-view>.ui-jqgrid-toppager,
.ui-jqgrid>.ui-jqgrid-view>.ui-jqgrid-hdiv,
.ui-jqgrid>.ui-jqgrid-view>.ui-jqgrid-bdiv,
.ui-jqgrid>.ui-jqgrid-view .ui-jqgrid-btable,
.ui-jqgrid>.ui-jqgrid-pager {
  min-width: 340px;
}

which not changes the width of columns, but which still increase the width of the grid. See https://codepen.io/anon/pen/BZjOmO

Alternatively one can use the code like the following as a workaround

$grid.on("jqGridResetFrozenHeights", function () {
    var width = $grid.jqGrid("getGridParam", "width"), minWidth = 340;

    if (width < minWidth) {
        $grid.jqGrid("setGridWidth", minWidth);
    }
});

See https://codepen.io/anon/pen/dRGqGO