Hi Mick,

I did something like this recently using some CSS hints on scrollable divs I
dug up on Google. (Sorry, don't have any links to those pages, but you
should find resources pretty easily...)

Here's my JSF page:

      <t:div styleClass="approverTableContainer">
         <af:table id="approverTable" var="row"
value="#{tewsClient.employeeApprovers}"
            bandingInterval="1" banding="row"
binding="#{formData.employeeApproversTable}">
            <f:facet name="selection">
               <af:tableSelectMany styleClass="afTableHeaderText" />
            </f:facet>
            <af:column>
               <f:facet name="header">
                  <h:outputText value="First Name"
styleClass="afTableHeaderText" />
               </f:facet>
               <af:outputText value="#{row.givenName}"
styleClass="afTableText" />
            </af:column>
            ...
         </af:table>
      </t:div>

And here is the relevant CSS snippet:

/* define height and width of scrollable area. Add 16px to width for
scrollbar          */
div.approverTableContainer {
clear: both;
position: relative;
left:   20px;
border: 0px solid #7F9DB9;
height: 244px;
overflow: auto;
width: 687px;}

/* Reset overflow value to hidden for all non-IE browsers. */
html>body div.approverTableContainer {
overflow: hidden;
width: 687px;}

/* define width of table. IE browsers only                 */
div.approverTableContainer table {
float: left;
width: 670px;}

/* define width of table. Add 16px to width for scrollbar.           */
/* All other non-IE browsers.                                        */
html>body div.approverTableContainer table {
width: 687px;}

/* define height and width of scrollable area. Add 16px to width for
scrollbar          */
div.inputTableContainer {
border: 0px solid #7F9DB9;
height: 88px;
overflow: auto;
width: 247px;}

I'm not a CSS expert and a lot of the cross-browser compatibility stuff goes
over my head. I was never able to get this to work in Firefox (if anyone
sees how to fix this, I'd love to know!) but hopefully it will get you
started!

Cheers,
Mike Gillan


Mick Knutson-4 wrote:
> 
> I want to make a data table area <div> scroll instead of my entire page
> being scrollable. Is this possible with my data area alone looks like:
> 
> <trim/>
> -- 
> 
> Thanks
> 
> DJ MICK
> http://www.djmick.com
> http://www.myspace.com/mickknutson
> 
> 

-- 
View this message in context: 
http://www.nabble.com/slightly--ot--ADF-scrolling-%3Caf%3Atable-question-tf2728096.html#a7613685
Sent from the MyFaces - Users mailing list archive at Nabble.com.

Reply via email to