use*_*325 5 css jsf primefaces
[Primefaces 5.0]
我有一个包含数据表的tabview.根据选项卡,数据表中填充了不同的数据(即不同数量的列和行).以下设置可以很好地处理数据,但无论我将max-height约束放在面板,选项卡还是数据表上,它似乎都不会将其限制在屏幕的百分比范围内.如果我将约束设置为特定值(例如300px),它可以工作,但我宁愿不行.
基本上:我想要一个适合其内容的数据表,直到它占据屏幕的30%.此时,它应该滚动.
<body style="min-width: 1366px;min-height: 768px;height: 100%;margin-left: 20px;">
<div style="width: 10%;float: left"> ... </div>
<div style="width: 90%;float: right">
<p:panel classStyle="panel" header="Instance Data View" style="width: 100%;max-height: 30%;margin-bottom: 1%">
<p:tabView value="#{pageBean.tables}" var="table" dynamic="true">
<p:tab title="#{table.tableName}" >
<p:dataTable var="row"
value="#{pageBean.tableData[table.tableName].data}"
resizableColumns="true">
<p:columns value="#{pageBean.tableData[table.tableName].columns}" style="white-space: normal;"
var="column" columnIndexVar="columnIndex">
<f:facet name="header">
<p:outputLabel value="#{column}"/>
</f:facet>
<p:outputLabel value="#{row[columnIndex]}"/>
</p:columns>
</p:dataTable>
</p:tab>
</p:tabView>
</p:panel>
...
</div>
</body>
Run Code Online (Sandbox Code Playgroud)
小智 0
您可以将ScrollWidth
and用于ScrollHeight
数据表。为此目的,有三种选择。例如 :
scrollHeight="30%"
scrollWidth="30%"
scrollable="true"
Run Code Online (Sandbox Code Playgroud)
通过这种方法,您可以控制数据表的大小。
ps:你没有说你的primefaces版本。