Column size calculation not working when combined with select and rowGroup extension
Column size calculation not working when combined with select and rowGroup extension
seaninjapan
Posts: 8Questions: 2Answers: 0
Link to test case:
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem:
We have a more or less complex datatable, which uses the select extension, as well as the rowGroup extension.
Everything worked fine with the 1.x version, but after updating to 2.1.4, the column-sizes are not calculated correctly anymore.
The header-cell of the select column is always wider than the cell of the column itself.
I think the reason for that is the way the width gets calculated for the column. I debugged through the datatable.net code and recognized that the calculation for the column itself works fine and the select column gets calculated with about 20px, which is more or less expected.
But the calculation method is later on called again, i think when the rowGroup extension gets initialized and uses the rowgroup levels as calculation base. The rowGroup div is over the whole width of the table. The table uses btw 100% width.
So it ends up calculating a width of the 100% of the table for the first column.
The following colgroup gets rendered:
<colgroup><col data-dt-column="0" style="width: 1687px;"><col data-dt-column="3" style="width: 676.641px;"><col data-dt-column="4" style="width: 91.8984px;"><col data-dt-column="5" style="width: 205.047px;"><col data-dt-column="6" style="width: 122.234px;"><col data-dt-column="7" style="width: 75.5781px;"><col data-dt-column="8" style="width: 106.07px;"><col data-dt-column="9" style="width: 112.906px;"><col data-dt-column="10" style="width: 138.664px;"><col data-dt-column="11" style="width: 124.961px;"></colgroup>
The total width of the table is 1678px. So it assigns the total table width to the first column.
Is this a problem of the calculation? Or is there anything we might be doing wrong on our side?
We have similar issues with the width of details-control, which did only use minimal width in version 1.x. But since update to 2.x in some tables the width has changed and it uses much more space than necessary. Because we render only an icon in there, the calculated space should actually be everywhere the same. But maybe this is worth another ticket?
Setting the width property for the above mentioned columns that not change anything. It gets ignored.
This question has an accepted answers - jump to answer
Answers
Unfortunately it is a problem with how the column widths are set and the combination of that with RowGroup using the first row in the table as a
rowspan. The browser attempts to apply the widths to the first row, which is obviously nonsense in such as case. I'm going to have to modify RowGroup to insert a hidden row at the top of the table.I'll get back to you on that.
Allan
It actually wasn't what I expected! The error was in DataTables core and how it handles column width correction. I've committed a fix and the nightly carries the fix.
Allan
Sorry Allan, took me ages to make the nightly build work in our setup.
I run it with your changes and it looks beautiful and fixes the issue!
Hope to see the changes soon available in 2.1.5.
Thank you for all your hard work, time and especially your incredible fast response.
Thank you for your kind words, and also for testing it - very much appreciated!
I'll probably drop 2.1.5 at the end of next week (2.1.4 was only last week, so I'll see if anything else crops up).
Allan