primefaces datatable scroll 自定义css

来源：互联网发布：windows 源代码编辑：程序博客网时间：2024/05/16 09:23

根据需求给dataTable 添加上scroll功能后，heaer box出现padding展示，为了去掉padding样式，需修改css文件。

在自己的css文件中加入如下代码：

.ui-datatable-scrollable-header-box{

padding-right:0px!important;
}

如果不加上！important，datatable不能应用该样式（具体请google it）

再在页面中加入如下代码

<span style="font-size:14px;">                         <p:dataTable id="appTableList" var="obj"value="#{cc.attrs.appData}" rendered="#{cc.attrs.appData.size()>0}" scrollable="#{cc.attrs.appData.size()>5?'true':'false'}"  scrollHeight="#{cc.attrs.appData.size()>=5?150:30*cc.attrs.appData.size()}"  styleClass="ui-datatable-scrollable-header-box"></span>

scrollable与scrollHeight两个属性是对scroll属性的设置，此处这样写是为了设置datatable中数据行数大于5行再显示scroll功能，否则不显示，并且scrollHeight也是根据行数来设置

0 0