Auto Column Width

Vaadin 6 / 7 / 8 Framework UI
1

Hi Guys,

I need to make the column width dynamic for the table.
I have 12 columns in my table out of which some column contains icons and some contains data.
When the data in the column is large then the other column data will get truncated and it will be seen after dragging the column.

I haven’t set any column width explicitly.

I want that if such data occurs in my table by default a scrollbar will come . Is it possible . Please help.

Regards
Tarun Sawlani

2

Scroll bars should be the default, not truncating. Are you sure you haven’t got some accidental column widths or column expand ratios. You can see the default scrolling behavior if you set your browser window small and load this address book demo:
http://demo.vaadin.com/AddressBook

3

Thanks for your reply.

But my requirement is to show a horizontal scrollbar if the column data is greater than its width.
I don’t want to use setColumnWidth() method.

I have tried setColumnExpandRatio() but its not solving the issue completely.

Can we do something which expands the column depending upon the content of the column. A horizontal scrollbar will be acceptable. But I don’t want to get the data truncated.

Regards,
Tarun Sawlani

4

If I remember correctly the column widths are measured by the column header width if no other has been specified.

So, you can either make the column artificially wider by padding the column header with some non breaking spaces, or if you don’t mind scrollbars in the rows then you can apply the CSS rule:

.v-table-cell-wrapper{
    overflow:auto;
}
5

Hey John,

sorry to revive a rather old thread, but I’m in the situation where I tried your solution.
The result I got was a scrollbar inside a cell. Is there a way to force the cell to expand (in width) to make sure that all the data is visible?
My client doesn’t really care about a horizontal scrollbar on the TABLE, but she doesn’t want a scrollbar inside of a cell.

thanks in advance!

Pieter