Core: make fixColumnWidth a public function

Add class name to colgroup when programmically added so calling the $.tablesorter.fixColumnWidth function can determine when to refresh the set col widths
This commit is contained in:
Mottie 2015-01-14 00:13:18 -06:00
parent 077004bdbb
commit 6cd67973cc
2 changed files with 46 additions and 16 deletions

View File

@ -5542,6 +5542,28 @@ var wo = $('#mytable').data('tablesorter').widgetOptions;
<tbody>
<tr id="function-fixcolumnwidth">
<td><a href="#" class="permalink">fixColumnWidth</a></td>
<td>This function adds a <code>colgroup</code> element to the table when <a href="#widthfixed"><code>widthFixed</code></a> is <code>true</code>.
<div class="collapsible"><br>
A new <code>colgroup</code> with <code>col</code> elements is only added if:
<ul>
<li><a href="#widthfixed"><code>widthFixed</code></a> is <code>true</code>.</li>
<li>A predefined <code>colgroup</code> element does not already exist in the table *.</li>
</ul>
* <span class="label label-info">Note</span> If a <code>colgroup</code> was added by the plugin, calling this function additional times will refresh the set widths<br>
<br>
Also, the <code>col</code> elements within the <code>colgroup</code> are set with a percentage width to dynamically maintain the fixed column width ratios.<br>
<br>
Use it as follows:
<pre class="prettyprint lang-js">$.tablesorter.fixColumnWidth( table );</pre>
<ul>
<li><code>table</code> - table DOM element (or jQuery object) of table.</li>
</ul>
</div>
</td>
</tr>
<tr id="function-processtbody">
<td><a href="#" class="permalink">processTbody</a></td>
<td>

View File

@ -131,6 +131,7 @@
table : 'tablesorter',
cssHasChild: 'tablesorter-hasChildRow',
childRow : 'tablesorter-childRow',
colgroup : 'tablesorter-colgroup',
header : 'tablesorter-header',
headerRow : 'tablesorter-headerRow',
headerIn : 'tablesorter-header-inner',
@ -590,21 +591,6 @@
});
}
// automatically add col group, and column sizes if set
function fixColumnWidth(table) {
var colgroup, overallWidth,
c = table.config;
if (c.widthFixed && c.$table.children('colgroup').length === 0) {
colgroup = $('<colgroup>');
overallWidth = $(table).width();
// only add col for visible columns - fixes #371
$(table.tBodies).not('.' + c.cssInfoBlock).find("tr:first").children(":visible").each(function() {
colgroup.append($('<col>').css('width', parseInt(($(this).width()/overallWidth)*1000, 10)/10 + '%'));
});
c.$table.prepend(colgroup);
}
}
function updateHeaderSortCount(table, list) {
var s, t, o, col, primary,
c = table.config,
@ -1127,7 +1113,7 @@
buildHeaders(table);
// fixate columns if the users supplies the fixedWidth option
// do this after theme has been applied
fixColumnWidth(table);
ts.fixColumnWidth(table);
// try to auto detect column type, and store in tables config
buildParserCache(table);
// start total row count at zero
@ -1183,6 +1169,28 @@
if (typeof c.initialized === 'function') { c.initialized(table); }
};
// automatically add a colgroup with col elements set to a percentage width
ts.fixColumnWidth = function(table) {
table = $(table)[0];
var overallWidth, percent,
c = table.config,
colgroup = c.$table.children('colgroup');
// remove plugin-added colgroup, in case we need to refresh the widths
if (colgroup.length && colgroup.hasClass(ts.css.colgroup)) {
colgroup.remove();
}
if (c.widthFixed && c.$table.children('colgroup').length === 0) {
colgroup = $('<colgroup class="' + ts.css.colgroup + '">');
overallWidth = c.$table.width();
// only add col for visible columns - fixes #371
$(table.tBodies).not('.' + c.cssInfoBlock).find('tr:first').children(':visible').each(function() {
percent = parseInt( ( $(this).width() / overallWidth ) * 1000, 10 ) / 10 + '%';
colgroup.append( $('<col>').css('width', percent) );
});
c.$table.prepend(colgroup);
}
};
ts.getColumnData = function(table, obj, indx, getCell, $headers){
if (typeof obj === 'undefined' || obj === null) { return; }
table = $(table)[0];