From 30ea0c7f46023ec346cefb77216b5d7fad6a3617 Mon Sep 17 00:00:00 2001 From: webchick Date: Sat, 28 Apr 2012 23:24:12 -0700 Subject: Issue #988930 by davidwhthomas, jyve, tim.plunkett, nod_, effulgentsia, droplet, patrickd: Fixed Sticky table headers need to react properly to 'show/hide weights column' link. --- misc/tabledrag.js | 4 ++++ misc/tableheader.js | 36 +++++++++++++++++++++++++++++------- 2 files changed, 33 insertions(+), 7 deletions(-) diff --git a/misc/tabledrag.js b/misc/tabledrag.js index 437b08c0f..fed674ca9 100644 --- a/misc/tabledrag.js +++ b/misc/tabledrag.js @@ -201,6 +201,8 @@ Drupal.tableDrag.prototype.hideColumns = function () { // The cookie expires in one year. expires: 365 }); + // Trigger an event to allow other scripts to react to this display change. + $('table.tabledrag-processed').trigger('columnschange', 'hide'); }; /** @@ -224,6 +226,8 @@ Drupal.tableDrag.prototype.showColumns = function () { // The cookie expires in one year. expires: 365 }); + // Trigger an event to allow other scripts to react to this display change. + $('table.tabledrag-processed').trigger('columnschange', 'show'); }; /** diff --git a/misc/tableheader.js b/misc/tableheader.js index 949ef5212..a9f98a680 100644 --- a/misc/tableheader.js +++ b/misc/tableheader.js @@ -27,6 +27,14 @@ Drupal.tableHeader = function (table) { this.originalTable = $(table); this.originalHeader = $(table).children('thead'); this.originalHeaderCells = this.originalHeader.find('> tr > th'); + this.displayWeight = null; + + // React to columns change to avoid making checks in the scroll callback. + this.originalTable.bind('columnschange', function (e, display) { + // This will force header size to be calculated on scroll. + self.widthCalculated = (self.displayWeight !== null && self.displayWeight === display); + self.displayWeight = display; + }); // Clone the table header so it inherits original jQuery properties. Hide // the table to avoid a flash of the header clone upon page load. @@ -95,15 +103,29 @@ Drupal.tableHeader.prototype.eventhandlerRecalculateStickyHeader = function (eve // visible or when forced. if (this.stickyVisible && (calculateWidth || !this.widthCalculated)) { this.widthCalculated = true; + var $that = null; + var $stickyCell = null; + var display = null; + var cellWidth = null; // Resize header and its cell widths. - this.stickyHeaderCells.each(function (index) { - var cellWidth = self.originalHeaderCells.eq(index).css('width'); - // Exception for IE7. - if (cellWidth == 'auto') { - cellWidth = self.originalHeaderCells.get(index).clientWidth + 'px'; + // Only apply width to visible table cells. This prevents the header from + // displaying incorrectly when the sticky header is no longer visible. + for (var i = 0, il = this.originalHeaderCells.length; i < il; i += 1) { + $that = $(this.originalHeaderCells[i]); + $stickyCell = this.stickyHeaderCells.eq($that.index()); + display = $that.css('display'); + if (display !== 'none') { + cellWidth = $that.css('width'); + // Exception for IE7. + if (cellWidth === 'auto') { + cellWidth = $that[0].clientWidth + 'px'; + } + $stickyCell.css({'width': cellWidth, 'display': display}); } - $(this).css('width', cellWidth); - }); + else { + $stickyCell.css('display', 'none'); + } + } this.stickyTable.css('width', this.originalTable.css('width')); } }; -- cgit v1.2.3