diff --git a/treegrid.js b/treegrid.js index 53e8bd9..f29f4e9 100644 --- a/treegrid.js +++ b/treegrid.js @@ -1,8 +1,11 @@ /** - * Very simple and fast tree grid/table, with support for fixed header and column, compatible with dynamic loading + * Very simple and fast tree grid/table, with support for: + * - fixed header and column + * - virtual scrolling + * - dynamic loading of child nodes * * License: MPL 2.0+, (c) Vitaliy Filippov 2016+ - * Version: 2017-01-24 + * Version: 2017-07-06 */ /** @@ -219,10 +222,7 @@ function TreeGridNode(node, grid, parentNode, insertIndex, skipSync) } } if (!skipSync) - { this.grid.syncView(); - this.grid.syncStickyHeaders(); - } } (function() { @@ -293,7 +293,7 @@ TreeGrid.prototype._renderNodes = function(nodes) } else nodes[i]._reuse = true; - nodes[i].render(undefined, undefined, false, true); + nodes[i].render(undefined, undefined, false, 2); this.renderedNodes.push(nodes[i]); } } @@ -528,7 +528,7 @@ TreeGrid.prototype.syncView = function() } this._setPlaceholder('top', this.tableWrapper.scrollTop-firstItemHeight); } - else + else if (this.stickyHeaders) { this.fixedColSizer.style.height = 0; this.tableSizer.style.height = 0; @@ -538,26 +538,12 @@ TreeGrid.prototype.syncView = function() var total = 0; if (this.stickyHeaders) { - if (this.fixedCol.offsetWidth) - this.setStickyColumnWidth(this.fixedCol.offsetWidth+'px'); - var h1, h2; - var h = []; + total = this.syncStickyHeaders(true); + } + else + { for (var i = 0; i < this.tbody.rows.length; i++) - { - h1 = this.tbody.rows[i].offsetHeight||0; - h2 = this.fixedColBody.rows[i].offsetHeight||0; - h[i] = h1 < h2 ? h2 : h1; - } - for (var i = 0; i < this.tbody.rows.length; i++) - { - if (h[i] && !this.tbody.rows[i].is_placeholder) - { - total += h[i]; - this.tbody.rows[i].style.height = h[i]+'px'; - this.fixedColBody.rows[i].style.height = h[i]+'px'; - } - } - this.syncStickyRow(); + total += (this.tbody.rows[i].offsetHeight||0); } if (endStart > 0 && endStart > rangeStart+rangeCount) { @@ -607,25 +593,26 @@ TreeGrid.prototype.setStickyColumnWidth = function(w) TreeGrid.prototype.syncStickyHeaders = function(sync_all) { if (!this.stickyHeaders || !this.wrapper.offsetParent) - return; + return 0; + var total = 0; if (this.fixedCol.offsetWidth) this.setStickyColumnWidth(this.fixedCol.offsetWidth+'px'); var h1, h2, h = []; if (sync_all) { - for (var i = 0; i < this.table.rows.length-1; i++) + for (var i = 0; i < this.tbody.rows.length; i++) { - h1 = this.table.rows[i+1].offsetHeight; - h2 = this.fixedCol.rows[i].offsetHeight; - if (h1 && h2) - h[i] = h1 < h2 ? h2 : h1; + h1 = this.tbody.rows[i].offsetHeight||0; + h2 = this.fixedColBody.rows[i].offsetHeight||0; + h[i] = h1 < h2 ? h2 : h1; } - for (var i = 0; i < this.table.rows.length-1; i++) + for (var i = 0; i < this.tbody.rows.length; i++) { - if (h[i]) + if (h[i] && !this.tbody.rows[i].is_placeholder) { - this.table.rows[i+1].style.height = h[i]+'px'; - this.fixedCol.rows[i].style.height = h[i]+'px'; + total += h[i]; + this.tbody.rows[i].style.height = h[i]+'px'; + this.fixedColBody.rows[i].style.height = h[i]+'px'; } } } @@ -648,12 +635,13 @@ TreeGrid.prototype.syncStickyHeaders = function(sync_all) { this.toSync[i].tr[k].style.height = h[j]+'px'; this.toSync[i].col_tr[k].style.height = h[j]+'px'; + total += h[j]; } } } } - this.toSync = []; this.syncStickyRow(); + return total; } TreeGrid.prototype.syncStickyRow = function() @@ -828,7 +816,7 @@ TreeGrid.prototype.stopCellEditing = function(td, _int) var inp = td.getElementsByTagName('input')[0]; var params = this.onStopCellEdit && this.onStopCellEdit(node, subrow, i, inp ? inp.value : null, td) || {}; - node.render(i, subrow, true); + node.render(i, subrow, true, 0); if (!_int) { for (var i = 0; i < this.editedCells.length; i++) @@ -1145,7 +1133,7 @@ TreeGridNode.prototype.render = function(colidx, rowidx, force, skipSync) modified = this._renderCell(i, j, cells[i] && cells[i][j], force) || modified; this._oldCells = cells; } - if (modified && this.grid.stickyHeaders) + if (modified && this.grid.stickyHeaders && skipSync !== 2) { this.grid.toSync.push(this); if (!skipSync) diff --git a/treegridtest.htm b/treegridtest.htm index 69450c0..65fd47f 100644 --- a/treegridtest.htm +++ b/treegridtest.htm @@ -48,7 +48,7 @@ th, td { border-width: 0 1px 1px 0 !important; } } return cells; } }); - document.body.appendChild(TG.wrapper); + document.body.appendChild(TG.wrapper||TG.table); TG.syncView(); /*setTimeout(function() { TG.setHeader([ '', '15 фев', '16 фев', '17 фев', '18 фев', '19 фев', '20 фев', '21 фев', '15 фев', '16 фев', '17 фев', '18 фев', '19 фев', '20 фев', '21 фев', '15 фев', '16 фев', '17 фев', '18 фев', '19 фев', '20 фев', '21 фев', '15 фев', '16 фев', '17 фев', '18 фев', '19 фев', '20 фев', '21 фев' ]);