Friday, November 19, 2010

Word wrap in AdvancedDataGrid

So getting a column field to wrap in an AdvancedDataGrid isn't as easy as just setting the "wordWrap" property to true. Maybe it should be, but it isn't.

First thing's first. Do you have an itemRenderer on the column you're trying to wrap. If the answer is yes you have to make sure that itemRenderer is based on a wrappable component. For argument's sake, lets say you have a Label itemRenderer, well you're going to have to change that to be based on Text, and you're going to have to give it a width to give it the capability to wrap (percentWidth = 100 works nicely).

Then set your wrap-able column to wordWrap = true.

Finally set your AdvancedDataGrid to have property variableRowHeight = true.

Here is a link to an example with the view source enabled.

3 comments:

Anonymous said...

It works for me and saved me time on this topic. Thanks, AJ

Kiran Reddy Karra said...

Thanks, nice post. Is there a way to wrap only headers and not the table content.
Thanks in advance

Pradip Jadhav said...

Thanks, nice post. In my application i am creating item renderer which extends UIComponent. Requirement is to show folder icon and then label. I have changed my code as per your information but still its not working at my end. Can you please help to solve this problem.

Thanks, Pradip Jadhav