What eventually worked for me is something like this:
<table>
<tbody>
<tr>
<td>
<t:div>
<t:div>
<!-- First output only the headers without any rows -->
<t:dataTable id="table1" other attributes>
<t:column >
<f:facet name="header">
<h:outputText value="Column 1" />
</t:commandSortHeader>
</f:facet>
</t:column>
<t:column >
<f:facet name="header">
<h:outputText value="Column 2" />
</t:commandSortHeader>
</f:facet>
</t:column>
<t:column >
<f:facet name="header">
<h:outputText value="Column 3" />
</t:commandSortHeader>
</f:facet>
</t:column>
</t:dataTable>
</t:div>
<!-- Create a scrollable div tag -->
<t:div style="overflow:auto;height:100px">
<!-- Now output only the rows without the headers -->
<t:dataTable id="table2" other attributes for data and variable
binding etc>
<t:column >
<h:outputText value="#{var.col1}" />
</t:column>
<t:column >
<h:outputText value="#{var.col2}" />
</t:column>
<t:column >
<h:outputText value="#{var.col3}" />
</t:column>
</t:dataTable>
</t:div>
</t:div>
</td>
</tr>
</tbody>
</table>
(Note: this solution requires more fine tuning as the column widths in
the headers table and the rows tables will not match by default. You
may want to set them to equal width so that they align.)
Hope this helps y'all.
----- Original Message ----
From: Grant Smith <[EMAIL PROTECTED]>
To: MyFaces Discussion <[email protected]>
Sent: Monday, February 4, 2008 6:45:54 PM
Subject: Re: html table with fixed headers and scrollable rows?
Yes,
use the following CSS:
div.tableContainer {
clear: both;
border: 1px solid #963;
height: 505px;
overflow: hidden;
width: 976px
}
div.tableContainer thead tr {
position: relative;
display: block;
width: 960px;
}
div.tableContainer tbody {
display: block;
height: 450px;
overflow: auto;
width: 976px;
}
Then wrap your datatable in a div, like this:
<div id="tableContainer" class="tableContainer">
<t:dataTable.....>
<t:column style="width:60px; padding-left: 3px;"
headerstyle="width:60px;">
</t:dataTable>
</div>
Note the style on the column is just an example. the left padding is quite
important because the scrollbar pushes your content inwards and then it doesn't
quite line up with the headings. I couldn't find any easier way than this.
On Feb 4, 2008 12:16 PM, CL <[EMAIL PROTECTED]> wrote:
Hi All,
Is there a way for tomahawk data tables to get fixed headers and scrollable
rows like the one shown at this URL:
http://www.imaputz.com/cssStuff/bigFourVersion.html#
or at
http://www.cssplay.co.uk/menu/tablescroll.html
Any help is appreciated. Thanks.
Never miss a thing. Make Yahoo your homepage.
--
Grant Smith
____________________________________________________________________________________
Never miss a thing. Make Yahoo your home page.
http://www.yahoo.com/r/hs
