在我的大学项目中,我正在将RichFaces迁移到PrimeFaces 5.1。在RichFaces中,dataTable使用HighCharts显示pieChart。在dataTable中获取值列outputText并传递给dataTable列中的Highchart show chart。这与PrimeFaces中需要的进程相同。
Richfaces:
<script>
jQuery(document).ready(function() {
populatePieChartInDataTable()
}
function populatePieChartInDataTable() {
var dataTableId;
dataTableId = 'studentDataTable';
generatePieChart(dataTableId, 'studentstatuspiechartdiv');
}
function generatePieChart(dataTableId, pieChartContainerDivId) {
var dataTable;
var cellElement;
var pieChartContent;
var pieChartContainerDynamicId;
var rowLength;
var cellLength;
dataTable = jQuery('table[id$="' + dataTableId + '"]')[0];
rowLength = dataTable.tBodies[0].rows.length;
for (var i = 0; i < rowLength; i++) {
pieChartContainerDynamicId = pieChartContainerDivId + ':' + i;
cellLength = dataTable.tBodies[0].rows[i].cells.length;
for (var j = 0; j < cellLength; j++) {
cellElement = dataTable.tBodies[0].rows[i].cells[j];
if (cellElement.childNodes.length == 3) {
pieChartContent = cellElement.childNodes[0].innerHTML;
cellElement.childNodes[1].setAttribute('id', pieChartContainerDynamicId);
createPieChartstudentStatus(pieChartContainerDynamicId,
pieChartContent);
}
}
}
}
</script>
<rich:datascroller id="dataTopScroller" for="studentDataTable"
page="#{student.dashboardDatascrollerIndex}"oncomplete="populatePieChartInDataTable();" reRender="dataTopScroller"/>
<rich:dataTable id="studentDataTable" value="#{student.responderDashboardDetailList}">
<rich:column style="width: 325px;">
<h:outputText id="pieChartData" value="#{student.pieChartData}" style="display: none;"/>
<f:verbatim><div id="studentStatusPiechartdiv" style="width: 300px; height: 100px; overflow: auto;">
</f:verbatim><f:verbatim>
</div></f:verbatim>
</rich:column>
</rich:dataTable>
我怀疑在primefaces中我使用Paginator来显示记录10到10.在Primefaces脚本中获取dataTable的行长度总数和dataTable单元格outputTert的pieChartData列值得到如上面的脚本代码并传递给higchart函数。