在primefaces数据表的paginator中动态调整行

时间:2015-06-15 09:13:21

标签: primefaces datatable

我正在使用primefaces数据表分页器。我已将行数no修复为15.这与我的系统分辨率正确匹配。但是用户正在使用具有不同(更大)分辨率的显示器。在这种情况下,行的数量将减少,并且底部将显示空格。 我可以根据屏幕分辨率动态增加这些行。 以下是我正在使用的代码。

<p:dataTable var="order" value="#{orderdetails.orderDetailsList}" scrollable="true" styleClass="ui-dynamic-height" 
sortMode="multiple"  emptyMessage="" frozenColumns="1" resizableColumns="true" widgetVar="orderstatustable" 
liveResize="true" paginator="true" rows="15" paginatorPosition="top" paginatorAlwaysVisible="false">

对此提出任何建议。

1 个答案:

答案 0 :(得分:1)

1.定义两个JSF inputHidden字段说明你的xhtml文件中的screenHeight和screenWidth
2.在页面加载时使用javascript计算computedHeight和computedWidth并将其存储到隐藏字段中 3.自动将值绑定到managedbean变量。
4.根据screenHeight和屏幕宽度,写一个返回no行的方法 5.通过表达式语言在JSF数据表行属性

中调用该方法

示例XHTML文件如下

&#13;
&#13;
 <h:head>

   <script type="text/javascript">
	
     function setResolution(){
 	   
		//Calculated the computedHeight and computedWidth from javascript
		 document.getElementById('myForm:screenHeight').value = computedHeight;
	         document.getElementById('myForm:screenWidth') .value=computedWidth;
	   }
     
</script>
</h:head>

<h:body onload="setResolution();">

<h:form id="myForm">
<h:inputHidden id="screenHeight" value="#{managedBean.screenHeight}" />
<h:inputHidden id="screenWidth" value="#{managedBean.screenWidth}" />

   // call rows="#{managedBean.calculatedRows}" 
<p:dataTable var="order" value="#{orderdetails.orderDetailsList}" scrollable="true" styleClass="ui-dynamic-height" sortMode="multiple"  emptyMessage="" frozenColumns="1" resizableColumns="true" widgetVar="orderstatustable" liveResize="true" paginator="true" rows="#{managedBean.calculatedRows}" paginatorPosition="top" paginatorAlwaysVisible="false">
</p:dataTable>
</h:form>

</h:body>
&#13;
&#13;
&#13;

示例托管Bean供您参考

&#13;
&#13;
@ManagedBean
public class ManagedBean implements serilizable{

private float screenHeight;
private float screenWidth;
//gets and setters

private int calculatedRows(){
//Your business logic to return no of rows based on 
//screenHeight and screenWidth(resolution)
}


}
&#13;
&#13;
&#13;