How to wrap column header in grid

[veenahosurParticipant]

HI,
I am referring this link for wrapping header.
This not working for me.Can any one tell me how to do it

[Peter StoevKeymaster]

Hi veenahosur,

If you want to wrap a column header, then when you set the column’s text in the Grid’s initialization you can add BR tags.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[veenahosurParticipant]

can you share example

[Peter StoevKeymaster]

Hi veenahosur,

It’s basically setting the “text” property of the column. This is shown in all our samples about the Grid. There, between the words, put a BR tag.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[philipstratfordParticipant]

This is a terrible solution. In fact, it’s just a workaround. If I’m writing a responsive page I don’t know where I want the breaks in my column headings to appear. If the viewport is wide enough I may not want breaks at all! And if the text of the column headings is dynamic and coming from a database, again, adding <br> tags is not possible.

Please can you add to your roadmap a new option, something like columnheaderheight, which accepts “auto” as an option, allowing text in the column heading to wrap if the column is not wide enough.

For anybody struggling with this in the meantime, I’ve been able to hack it using this CSS:

.jqx-grid-column-header > div > div > span[style] { /*Cause header text to wrap to new line rather than be truncated*/
     white-space: normal;
  }

[Author]

Posts