diff --git a/frontend/src/utils/async-table/async-table.js b/frontend/src/utils/async-table/async-table.js index 416ebd34c..9cd1c639d 100644 --- a/frontend/src/utils/async-table/async-table.js +++ b/frontend/src/utils/async-table/async-table.js @@ -13,7 +13,6 @@ const ASYNC_TABLE_INITIALIZED_CLASS = 'async-table--initialized'; const ASYNC_TABLE_LOADING_CLASS = 'async-table--loading'; const ASYNC_TABLE_FILTER_FORM_SELECTOR = '.table-filter-form'; -const ASYNC_TABLE_FILTER_FORM_ID_SELECTOR = '[name="form-identifier"]'; @Utility({ selector: '[uw-async-table]', @@ -213,7 +212,7 @@ export class AsyncTable { } _updateFromTableFilter(tableFilterForm) { - const url = this._serializeTableFilterToURL(); + const url = this._serializeTableFilterToURL(tableFilterForm); let callback = null; const focusedInput = tableFilterForm.querySelector(':focus, :active'); @@ -237,40 +236,17 @@ export class AsyncTable { this._updateTableFrom(url, callback); } - _serializeTableFilterToURL() { + _serializeTableFilterToURL(tableFilterForm) { const url = new URL(getLocalStorageParameter('currentTableUrl') || window.location.href); + const formData = new FormData(tableFilterForm); - const formIdElement = this._element.querySelector(ASYNC_TABLE_FILTER_FORM_ID_SELECTOR); - if (!formIdElement) { - // cannot serialize the filter form without an identifier - return; + for (var k of url.searchParams.keys()) { + url.searchParams.delete(k); } - url.searchParams.set('form-identifier', formIdElement.value); - url.searchParams.set('_hasdata', 'true'); - url.searchParams.set(this._asyncTableId + '-page', '0'); - - this._tableFilterInputs.search.forEach(function(input) { - url.searchParams.set(input.name, input.value); - }); - - this._tableFilterInputs.input.forEach(function(input) { - url.searchParams.set(input.name, input.value); - }); - - this._tableFilterInputs.change.forEach(function(input) { - if (input.checked) { - url.searchParams.set(input.name, input.value); - } - }); - - this._tableFilterInputs.select.forEach(function(select) { - const options = Array.from(select.querySelectorAll('option')); - const selected = options.find((option) => option.selected); - if (selected) { - url.searchParams.set(select.name, selected.value); - } - }); + for (var kv of formData.entries()) { + url.searchParams.append(encodeURIComponent(kv[0]), encodeURIComponent(kv[1])); + } return url; }