我正在JSF页面中处理一个数据表JQuery,但问题是尽管显示了分页,但它仍然不起作用。
这是我的页面:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://java.sun.com/jsf/passthrough"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
<title>Test-Page</title>
<link rel="stylesheet" type="text/css" href="../css/jquery.dataTables.css" />
<link rel="stylesheet" type="text/css" href="../css/shCore.css" />
<link rel="stylesheet" type="text/css" href="../css/demo.css" />
<link rel="stylesheet" type="text/css" href="../css/header.css" />
<link rel="stylesheet" type="text/css" href="../css/style_combo.css" />
<style type="text/css" class="init"></style>
<script type="text/javascript" language="javascript" src="../js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="../js/jquery.dataTables.js"></script>
<script type="text/javascript" language="javascript" src="../js/shCore.js"></script>
<script type="text/javascript" language="javascript" src="../js/demo.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$('#example').dataTable({
"bPaginate": true,
"bFilter": false,
"bInfo": true,
"bProcessing" : false,
"bJQueryUI" : true,
"sEmptyTable" : "No messages found",
});
} );
</script>
</h:head>
<h:body class="dt-example">
<h:form>
<table id="example" class="display compact" cellspacing="0"
width="100%">
<ui:repeat var="ee" value="#{controller.address}"
varStatus="row">
<thead>
<tr>
<ui:repeat value="#{ee.entrySet().toArray()}" var="entete1">
<th><h:outputLabel value="#{entete1.key}"
rendered="#{row.index == 0}" /></th>
</ui:repeat>
</tr>
</thead>
<tbody>
<tr>
<ui:repeat value="#{ee.entrySet().toArray()}" var="entete">
<td><h:outputLabel value="#{entete.value}" /></td>
</ui:repeat>
</tr>
</tbody>
</ui:repeat>
</table>
</h:form>
</h:body>
</ui:composition>
只要bPaginate是真的,我相信分页必须毫无问题地工作,除了我的页面不是这样。知道吗?
注意:现在jsf和richfaces中有数据表和扩展表,但我必须使用上面的代码。
经过长时间的分析,我发现和不必在循环中,列的数量也必须与标题中的相同。
css和js文件总是一样的,我只更改了<h:form></h:form>
的内容
下面是一个运行良好的例子:
<h:form>
<table id="example" class="cell-border" cellspacing="0" width="100%">
<thead>
<tr>
<ui:repeat value="#{mycontroler.listOfHead}" var="head">
<th><h:outputLabel value="#{head}" /></th>
</ui:repeat>
</tr>
</thead>
<tbody>
<ui:repeat var="details" value="#{mycontroler.ExampleLits}"
varStatus="rowStatus">
<tr>
<ui:repeat value="#{details.entrySet().toArray()}" var="details2">
<td><h:outputLabel value="#{details2.value}">
</h:outputLabel></td>
</ui:repeat>
</tr>
</ui:repeat>
</tbody>
</table>
</h:form>