JSF table


We are trying to integrate JSF table with dtml grid (shown as below). In IE6, the grid showed up as expected but lots of empty lines are inserted before the grid so that user has to scroll all the way down to find them.

Notice this is only happending in IE 6 but now Firefox. Any ideas how to resolve this issue?



<script type=“text/javascript” src="<c:url value="/js/dhtmlXGrid_start.js"/>">    



<h:dataTable id=“beforeSessions” styleClass=“dhtmlxGrid” style=“margin-top: 0px; width:905px; height:245px” value="#{SessionBefore.sessions}" var=“session”>


        <f:facet name=“header”><h:outputText value=“Session #”/></f:facet>

        <h:outputText value="#{session.sessionNumber}"/>



        <f:facet name=“header”><h:outputText value=“Session Name”/></f:facet>

        <h:outputText value="#{session.name}"/>





There are two situations possile

a) empty lines occur before grid

In such case - the problem is in surrounding layour , the grid is normal HTML container, and its position on page defined by layour and styles applied to surrounding containers.

b) empty line occurs between grid header and body.

Such problem can occur only if you loaded data in grid while it in invisible state, or in case of loading complex TABLE layout and initializing grid in moment when table not fully rendered yet - in both cases grid can’t detect initial sizes and render correctly.
You can
- call grid.setSizes() after switching to visible state
-  init grid after TABLE structure fully rendered ( place JS code after closing TABLE tag ) or init grid from onLoad event of page.

If problem still occurs for you - please provide an result HTML page, which generated from your JSF code. ( the source code from browser )