scroll to top after changing page in paginated table

This commit is contained in:
Felix Hamann 2019-02-09 14:23:53 +01:00
parent 89f1a28e2e
commit 38d9b73c66

View File

@ -40,7 +40,7 @@
if (pagesizeForm) { if (pagesizeForm) {
var pagesizeSelect = pagesizeForm.querySelector('[name=' + tableIdent + '-pagesize]') var pagesizeSelect = pagesizeForm.querySelector('[name=' + tableIdent + '-pagesize]')
pagesizeSelect.addEventListener('change', changeHandler); pagesizeSelect.addEventListener('change', changePagesizeHandler);
} }
} }
@ -58,14 +58,14 @@
if (pagesizeForm) { if (pagesizeForm) {
var pagesizeSelect = pagesizeForm.querySelector('[name=' + tableIdent + '-pagesize]') var pagesizeSelect = pagesizeForm.querySelector('[name=' + tableIdent + '-pagesize]')
pagesizeSelect.removeEventListener('change', changeHandler); pagesizeSelect.removeEventListener('change', changePagesizeHandler);
} }
} }
function clickHandler(event) { function clickHandler(event) {
event.preventDefault(); event.preventDefault();
var url = new URL(window.location.origin + window.location.pathname + getClickDestination(this)); var url = new URL(window.location.origin + window.location.pathname + getClickDestination(this));
updateTableFrom(url); updateTableFrom(url, { scrollToTop: true });
} }
function getClickDestination(el) { function getClickDestination(el) {
@ -75,7 +75,7 @@
return el.querySelector('a').getAttribute('href'); return el.querySelector('a').getAttribute('href');
} }
function changeHandler(event) { function changePagesizeHandler(event) {
var currentTableUrl = wrapper.dataset.currentUrl || window.location.href; var currentTableUrl = wrapper.dataset.currentUrl || window.location.href;
var url = getUrlWithUpdatedPagesize(currentTableUrl, event.target.value); var url = getUrlWithUpdatedPagesize(currentTableUrl, event.target.value);
url = getUrlWithResetPagenumber(url); url = getUrlWithResetPagenumber(url);
@ -113,7 +113,7 @@
} }
// fetches new sorted table from url with params and replaces contents of current table // fetches new sorted table from url with params and replaces contents of current table
function updateTableFrom(url) { function updateTableFrom(url, options) {
fetch(url, { fetch(url, {
credentials: 'same-origin', credentials: 'same-origin',
@ -130,6 +130,9 @@
wrapper.dataset.currentUrl = url; wrapper.dataset.currentUrl = url;
removeListeners(); removeListeners();
updateWrapperContents(data); updateWrapperContents(data);
if (options && options.scrollToTop) {
window.scrollTo(0, 0);
}
}).catch(function(err) { }).catch(function(err) {
console.error(err); console.error(err);
}); });