开发者

How to restrict maximum height of row in jqgrid

Column contains long multiline texts which make row height too big.

I tried styles below based on Tony's answer in http://www.trirand.com/blog/?page_id=393/help/possible-row-height-bug-in-i开发者_如何学Gon-ie8/

but those do not limit row maximum height: Row height is still equal to by number of lines in column.

How to limit maximum height of row to some value? Text should not wrap (as it already is using jqGrid default settings) and remaining rows should not shown. (Whole text can examined in edit mode if edittype textarea is used).

jqgrid tr.jqgrow td { 
  max-height  : 100px;
 }

ui-jqgrid tr.jqgrow td {
 max-height  : 100px;
 }

td {
  max-height  : 100px;
  }

tr {
  max-height  : 100px;
  }


You can't use max-height on td or tr elements, but you can place the multiline text inside of the <div> having the same style. To do this you can use for example the following custom formatter:

formatter: function(v) {
    return '<div style="max-height: 100px">' + v + '</div>';
}

or place the <div style="max-height: 100px">...</div> inside of your JSON/XML data. As the result you will have something like

How to restrict maximum height of row in jqgrid

(I displayed tooltip during I made the screenshot to show that the data in the cell contain more lines as displayed in the grid) See the corresponding demo here.


I know this is late, but you can use this CSS for ALL columns:

.ui-jqgrid tr.jqgrow td {
    white-space:nowrap;
}

Or, for an individual column:

.no-wrap-col {
    white-space: nowrap;
}

Then in your ColModel, on whichever column you want to prevent wrapping on, apply the class:

classes: "no-wrap-col"
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜