Wednesday, February 21, 2007

Aligning JSF Panel Grids

Found this at http://forum.java.sun.com/thread.jspa?threadID=736808&messageID=4233027 but the answer was a little mangled.

Suppose you want to put to tables of different sizes side-by-side in two columns of a containing table. This JSF you need is
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>

<style>
.alignTop {
vertical-align:top;
}
</style>

<f:view>
<h:panelGrid columns="2" columnClasses="alignTop, alignTop">
<h:panelGrid columns="3" >

<h:outputText value="1"/>
<h:outputText value="2"/>
<h:outputText value="3"/>
<h:outputText value="4"/>
<h:outputText value="5"/>
<h:outputText value="6"/>

</h:panelGrid>

<h:panelGrid columns="3">

<h:outputText value="1"/>
<h:outputText value="2"/>
<h:outputText value="3"/>
<h:outputText value="4"/>
<h:outputText value="5"/>
<h:outputText value="6"/>
<h:outputText value="7"/>
<h:outputText value="8"/>
<h:outputText value="9"/>

</h:panelGrid>

</h:panelGrid>
</f:view>

That is, note you need two "alignTop" strings separated by a comma for the value of the columnClasses attribute. If you have only one "alignTop" it will only apply to the first column. To see this, switch the two inner panel grids.

Probably there is a better way to do this.

7 comments:

Zhigang Qi said...

:),I got it by google...top post

Colica said...

thanks a lot guy, yu saved me a lot of time

Unknown said...

I wish I had hit your blog sooner. Could have save a couple of hours. Thanks a lot friend.

Unknown said...

I wish I had found your post sooner. Could have saved a couple of hours.

Thanks a lot friend.

Unknown said...

No problem. Get a blog and do the same to return the favor. You'll be surprised at how useful this is.

Robert Mark Bram said...

Thank you - quite a help. :)

Also, I found this:

use the rowClass="vertTop"
and the in your css file
.vertTop {
vertical-align:top;
}

From: http://www.mail-archive.com/users@myfaces.apache.org/msg34099.html

A little less typing maybe. :)

Rob
:)

Unknown said...

bravo majstore