<p:datatable scrollable="true"> not working

[amarshi mohanty]

Hi There,
for the below code

<p:dataTable var="temp1" value="#{myManagedBean.employees}" height="10px" width="150px"
      rows="5" id="amarshi1" selectionMode="single" scrollable="true"
      >
          <p:column sortBy="#{temp1.empId}" resizable="true">
            <f:facet name="header"><h:outputText value="Column-1" /></f:facet>
            <h:outputText value="#{temp1.empId}"></h:outputText>
        </p:column >
        <p:column resizable="true">
           <f:facet name="header"><h:outputText value="Column-2" /></f:facet>
           <h:outputText value="#{temp1.empName}"></h:outputText>
        </p:column>
        <p:column resizable="true">
            <f:facet name="header"><h:outputText value="Column-3" /></f:facet>
            <h:outputText value="#{temp1.empSal}"></h:outputText>
        </p:column>
      </p:dataTable>

nothing is displayed on the browser , but if i remove the scrollable attribute , the table is displayed properly,but i need the vertical scrollbar.
Please suggest.


Thanks,
amarshi

[Ajil Mohan]

Hi Amarshi,

Does p:dataTable has 'scrollable' attribute ?

regards
Ajil

[Cesar Loachamin]

Hi Amarshi,

Try this, first remove the scrollable="true" (if it is the problem) from the datatable and put it inside a div, just like this.

<div style="overflow:auto; width:100%; height=100px;">
    <p:dataTable var="temp1" value="#{myManagedBean.employees}" 
         rows="5" id="amarshi1" selectionMode="single">  
           <p:column sortBy="#{temp1.empId}" resizable="true">  
                <f:facet name="header"><h:outputText value="Column-1" /></f:facet>  
                <h:outputText value="#{temp1.empId}"></h:outputText>  
            </p:column >  
            <p:column resizable="true">  
               <f:facet name="header"><h:outputText value="Column-2" /></f:facet>  
               <h:outputText value="#{temp1.empName}"></h:outputText>  
           </p:column>  
           <p:column resizable="true">  
               <f:facet name="header"><h:outputText value="Column-3" /></f:facet>  
               <h:outputText value="#{temp1.empSal}"></h:outputText>  
           </p:column>  
    </p:dataTable>  
</div>

With this you have a vertical scrollbar

Regards

Cesar

[Brendan Healey]

I think this got broken in 2.2-RC1 / 2.2-RC2. What you may wish to try is using something like:

<p:dataTable style="overflow: auto; width: 700px" .../>

Regards,
Brendan.