ignore pending requests for async table filters if new input exists

closes #325

frontend/src/utils/async-table/async-table.js

@@ -38,6 +38,7 @@ export class AsyncTable {
     change: [],
     select: [],
   };
+  _ignoreRequest = false;
 
   constructor(element, app) {
     if (!element) {
@@ -174,6 +175,10 @@ export class AsyncTable {
         }
       }, INPUT_DEBOUNCE);
       input.addEventListener('input', debouncedInput);
+      input.addEventListener('input', () => {
+        // set flag to ignore any currently pending requests (not debounced)
+        this._ignoreRequest = true;
+      });
     });
 
     this._tableFilterInputs.input.forEach((input) => {
@@ -183,6 +188,10 @@ export class AsyncTable {
         }
       }, INPUT_DEBOUNCE);
       input.addEventListener('input', debouncedInput);
+      input.addEventListener('input', () => {
+        // set flag to ignore any currently pending requests (not debounced)
+        this._ignoreRequest = true;
+      });
     });
 
     this._tableFilterInputs.change.forEach((input) => {
@@ -224,6 +233,7 @@ export class AsyncTable {
         }
       };
     }
+    this._ignoreRequest = false;
     this._updateTableFrom(url, callback);
   }
 
@@ -340,8 +350,13 @@ export class AsyncTable {
       url: url,
       headers: headers,
     }).then(
-      (response) => this._app.htmlHelpers.parseResponse(response)
+      (response) => this._app.htmlHelpers.parseResponse(response),
     ).then((response) => {
+        // check if request should be ignored
+      if (this._ignoreRequest) {
+        return false;
+      }
+
       setLocalStorageParameter('currentTableUrl', url.href);
       // reset table
       this._removeListeners();