ADF Table with Flowing Layout

Probably one of the overlook features of the af:table is it ability to geometrically  adjust to a flowing layout based on the table's rangsize property (well along with a couple configurations).

So for this blog, I'll be creating a simple page which is flowing (of course) and render 3 tables flowing vertically with the table size adjusting with the minimum # of rows that I'd like to display.

High level design would look something like this.

Blue = panelGroupLayout (vertical)
Green = panelBox
Orange = adf table = styleClass as AFStretchWidth (this is because we set a stretch component inside a flowing)
White = for screenshot purpose hehe.

Well adf table also needs immediate set to its content delivery and rangsize. Yeah the only drawback is the immediate, so I definitely don't recommend trying to set a table which queries hundreds of rows in here. But still particularly good for those which you know will always be filtered.

Ow, and also autoHeightRows should be equal to 0.

Employees Table sample JSF code

Working Code

I forced the vertical scrollBar to show up hehe.