primefaces datatable rowexpansion with hidden column issue

Question

I'm using PrimeFaces 6.0 I aim to create a data table with rowexpansion but I don't want to display rowtoggler. Expansion will occur on row selection. For this I have added to my code:

$(document).ready(function() {
      rowExpansion(PF('carDataTable'));
   });

function rowExpansion(dataTable) {
      //dataTable should be the widgetVar object
      var $this = dataTable;
      $this.tbody.off('click.datatable-expansion', '> tr')
         .on('click.datatable-expansion', '> tr', null, function() {
            //toggle the current row the old toggler
            $this.toggleExpansion($(this).find('div.ui-row-toggler'));
          });
}

Rowtoggler column is hidden as:

<p:column style="display:none">
    <p:rowToggler />
</p:column>

The problem is that when row is expanded, the size of rows shrink. This also happens when any hidden column other than rowtoggler column exists. How it appears without expansion and with expansion is as follows: before expansion after expansion

any workaround or explanation is appreciated.

Answer 1

The issue is solved with a workaround. Instead of setting column property as display:none, hiding it by setting 0 size seems working.

<p:column style="width:0px;height:0px;padding:0px;border:0px">
    <p:rowToggler />
</p:column>