Jqgrid headers on two or more rows

Question

I have the following problem: I need to put on two or more rows header content of a Jqgrid. I saw the example provided by Zac on jqgrid double headers under alternatives, but by changing only the css I get no change on the grid. Is it possible to have a more complete example in order to reproduce the behavior? Thanks Angelo

Answer 1

If I understand you correct you want have multi-line column headers. You can do this with following additional CSS

<style type="text/css" media="screen">
    th.ui-th-column div{
        white-space:normal !important;
        height:auto !important;
        padding:2px;
    }
</style>

After that you will have columns like here

In the example the text 'Amount in EUR' was wrapped automatically and in the text from the first header the line break was made explicitly with 'Inv
No'.

In the answer you will see the link to the demo.

UPDATED: In the answer you will find more recent code.