From 6fbd3ba8e6760f02c1b2407ade96710c1329a96d Mon Sep 17 00:00:00 2001 From: Allan Jardine Date: Wed, 15 Jan 2014 16:19:03 +0000 Subject: [PATCH] New: Add the ability to read size information from HTML elements for columns - Column width is always a particularly difficult one to get quite right. In this case, the fix is to have DataTables read column width information from the `width` or `style` attributes of a column header cell, if that information is present. If it is, it is treated as sWidth is (although user supplied sWidth can override). That is it say that it will be applied to the column width calculation table. - The remaining gap is if a developer assigns a width using css classes. We can't get that information, so we fall into the old problem. - This change comes about from the discussion in http://datatables.net/forums/discussion/19089 and the fiddle here: http://jsfiddle.net/EysLd/1/ - What is happening in the test case is that the calculation table is being created, but it is then stripped of widths due to this commit: https://github.com/DataTables/DataTables/commit/6a9e324 . That was to allow DataTables column headers to have their applied size removed, so a new size could be calculated. Only sWidth would override that - now the width and style attributes will as well --- .datatables-commit-sync | 2 +- media/js/jquery.dataTables.js | 15 +++++++++++++++ 2 files changed, 16 insertions(+), 1 deletion(-) diff --git a/.datatables-commit-sync b/.datatables-commit-sync index df1ff7c9..e7000eca 100644 --- a/.datatables-commit-sync +++ b/.datatables-commit-sync @@ -1 +1 @@ -f06ee8a003374ac5653079a2fc2587e496f7480f +41dc47b2d50e3bf87e4266365c24257c64a5e3ae diff --git a/media/js/jquery.dataTables.js b/media/js/jquery.dataTables.js index 0a58f2a7..3ad2b951 100644 --- a/media/js/jquery.dataTables.js +++ b/media/js/jquery.dataTables.js @@ -526,6 +526,21 @@ var oCol = oSettings.aoColumns[ iCol ]; var oClasses = oSettings.oClasses; + // Try to get width information from the DOM. We can't get it from CSS + // as we'd need to parse the CSS stylesheet. `width` option can override + if ( ! oCol.sWidthOrig ) { + var th = $(oCol.nTh); + + // Width attribute + oCol.sWidthOrig = th.attr('width') || null; + + // Style attribute + var t = (th.attr('style') || '').match(/width:\s*(\d+[pxem%])/); + if ( t ) { + oCol.sWidthOrig = t[1]; + } + } + /* User specified column options */ if ( oOptions !== undefined && oOptions !== null ) {