Skip to content

Commit 336a767

Browse files
authored
Fix: abort previous filter request on new keystroke (#1263)
The autosubmit filter had two issues: 1. The debounce() utility used a blockedByPromise mechanism that silently discarded keystrokes while a request was in flight. When the server was slow, the user could type "abc" but only get results for "a" because "b" and "c" were dropped. Removed blockedByPromise so debounce always resets the timer. 2. When typing slowly (>200ms between keystrokes), each keystroke triggered a separate AJAX request, but previous requests were never aborted. Added data-naja-unique attribute to the filter form so Naja's built-in UniqueExtension automatically aborts the previous request when a new one starts.
1 parent 043d16e commit 336a767

File tree

2 files changed

+2
-12
lines changed

2 files changed

+2
-12
lines changed

assets/utils.ts

Lines changed: 1 addition & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -121,21 +121,11 @@ export function debounce<TArgs, TFun extends (...args: TArgs[]) => unknown | Pro
121121
slowdown: number = 200
122122
): (...args: TArgs[]) => void {
123123
let timeout: ReturnType<typeof setTimeout> | null = null;
124-
let blockedByPromise: boolean = false;
125124

126125
return (...args) => {
127-
if (blockedByPromise) return;
128-
129126
timeout && clearTimeout(timeout);
130127
timeout = setTimeout(() => {
131-
const result = fn(...args);
132-
133-
if (isPromise(result)) {
134-
blockedByPromise = true;
135-
result.finally(() => {
136-
blockedByPromise = false;
137-
});
138-
}
128+
fn(...args);
139129
}, slowdown);
140130
};
141131
}

src/templates/datagrid.latte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
<div class="{block datagrid-class}datagrid{/block}" data-datagrid-name="{$control->getFullName()}" data-refresh-state="{link refreshState!}">
1818
<div n:snippet="grid">
1919
{snippetArea gridSnippets}
20-
{form filter, class => 'ajax'}
20+
{form filter, class => 'ajax', data-naja-unique => "datagrid-filter-{$control->getFullName()}"}
2121
{if $control->hasOuterFilterRendering()}
2222
{block outer-filters}
2323
<div class="row text-end datagrid-collapse-filters-button-row" n:if="$control->hasCollapsibleOuterFilters()">

0 commit comments

Comments
 (0)