I have a form with a primefaces datatable which i have set the columns width in css for it :
.idcol{width: 5%}
.prioritycol{width: 5%}
.titlecol{width: 30%}
.descriptioncol{width: 40%}
.actionscol{width: 10px}
Everything is okay but when i add the scrollable="true"
attribute in order to have a scrollable datatable, the result is worst :
This is the declaration of the datatable :
<p:dataTable id="dtable" var="todos" value="#{todo.todoList}" scrollable="true"
resizableColumns="false" scrollHeight="300" lazy="true"
styleClass="idcol,prioritycol,titlecol,descriptioncol,actionscol">
What is the problem? Thank you!
You can set the column width this way
<p:column headerText="Type" width="70%">
or you can specify style class this way
<p:column headerText="Type" styleClass="idcol" >
You can add scrollWidth some thing like this
<p:dataTable var="data" rowKey="#{data.key}" style="width:70%"
sortOrder="ascending"
selection=""
value=""
selectionMode="single"
scrollable="true"
scrollWidth="71%"
scrollHeight="3%"
>
<p:ajax event="rowSelect" listener=""
update="" />
<p:column headerText="Type" styleClass="" sortBy="" width="70%">
<h:outputText id="dataTYpe" value="" />
</p:column>
<p:column headerText="Category" sortBy="" width="30%">
<h:outputText value="" />
</p:column>
</p:dataTable>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With