diff --git a/templates/table/layout.julius b/templates/table/layout.julius index 43a6595a3..296f03721 100644 --- a/templates/table/layout.julius +++ b/templates/table/layout.julius @@ -5,7 +5,7 @@ window.utils.asyncTable = function(wrapper, options) { - var tableIdent = #{String dbtIdent}; + var tableIdent = wrapper.dataset.dbtIdent; var shortCircuitHeader = #{String (toPathPiece HeaderDBTableShortcircuit)}; var ths = []; @@ -14,7 +14,7 @@ var scrollTable; function init() { - var table = wrapper.querySelector('#' + tableIdent); + var table = wrapper.querySelector('#' + tableIdent); if (!table) { return; } @@ -38,8 +38,8 @@ pagesizeForm = wrapper.querySelector('#' + tableIdent + '-pagesize-form'); // take options into account - if (options && options.scrollToTop) { - window.scrollTo(0, 0); + if (options && options.scrollTo) { + window.scrollTo(options.scrollTo); } if (options && options.horizPos && scrollTable) { @@ -63,13 +63,22 @@ pageLinks.forEach(function(link) { link.clickHandler = function(event) { var boundClickHandler = clickHandler.bind(this); - boundClickHandler(event, { scrollToTop: true }); + var wrapperBoundingRect = wrapper.getBoundingClientRect(); + var options = {}; + if (wrapperBoundingRect.top < 160) { + options.scrollTo = { + top: (wrapper.offsetTop || 0) - 60, + left: wrapper.offsetLeft || 0, + behavior: 'smooth', + }; + } + boundClickHandler(event, options); } link.element.addEventListener('click', link.clickHandler); }); if (pagesizeForm) { - var pagesizeSelect = pagesizeForm.querySelector('[name=' + tableIdent + '-pagesize]') + var pagesizeSelect = pagesizeForm.querySelector('[name=' + tableIdent + '-pagesize]'); pagesizeSelect.addEventListener('change', changePagesizeHandler); } } @@ -167,9 +176,11 @@ })(); document.addEventListener('DOMContentLoaded', function() { - var selector = '#' + #{String $ dbtIdent} + '-table-wrapper:not(.js-initialized)'; + var dbtIdent = #{String $ dbtIdent}; + var selector = '#' + dbtIdent + '-table-wrapper:not(.js-initialized)'; var wrapper = document.querySelector(selector); if (wrapper) { + wrapper.dataset.dbtIdent = dbtIdent; window.utils.asyncTable(wrapper); } });