This question already has an answer here:
-
Primefaces datatable frozen columns misallignment
3 answers
I have the row heights mismatch problem with the Primefaces data table frozen columns. Row heights of the frozen and not-frozen columns do not match, acting like independent data tables. The row heights are adjusted independently in the left and right layouts.
Any workarounds would be appreciated.
For PrimeFaces version 5.3 i wrote workaround to synchronize rows height, it is a little javascript function called on dom ready:
<h:outputScript target="body">
$(function() {
synchronizeRowsHeight();
});
function synchronizeRowsHeight() {
var $leftRows = $('.ui-datatable-frozenlayout-left').find('tr');
var $rightRows = $('.ui-datatable-frozenlayout-right').find('tr');
$leftRows.each(function (index) {
var $leftRow = $(this);
var $rightRow = $rightRows.eq(index);
if ($rightRow.innerHeight() > $leftRow.innerHeight()) {
$leftRow.innerHeight($rightRow.outerHeight());
} else {
$rightRow.innerHeight($leftRow.outerHeight());
}
})
}
</h:outputScript>