How to let the last ajaxResponseRenderer win?

When typing "test" pretty fast into textfield id=nameFilter the result is wrong. I am typical getting "DEBUG nameFilter: te" (sometimes just "t"). The grid data corresponds to the nameFilter output.

The output from  getNamefilterDebug() is always:
getNamefilterDebug: t
getNamefilterDebug: te
getNamefilterDebug: tes
getNamefilterDebug: test



<t:form t:id="nameFilterForm" id="nameFilterForm" async="true" autofocus="true" style="display:flex;align-items: center;">
    <t:label for="nameFilter">Name:</t:label>
    <t:textfield t:id="nameFilter" oninput="$(this).closest('form').submit()" style="vertical-align: top" value="nameFilter" autocomplete="off"/>
    <t:zone t:id="destinationCountZone">${destinationBeans.size()}</t:zone>
</t:form>

<t:zone t:id="destinationTableZone">
    DEBUG nameFilter: ${namefilterDebug}

    <t:grid renderTableIfEmpty="true" style="width:auto" source="destinationBeans" rowClass="prop:rowClass" class="table table-hover table-bordered" t:row="destinationBean" model="model" rowsPerPage="1000" t:pagerPosition="top">


void onSubmitFromNameFilterForm() {
    applyFilter();
    ajaxResponseRenderer.addRender(destinationTableZone);
}


public String getNamefilterDebug() {
    System.err.format("getNamefilterDebug: %s%n",nameFilter);
    return nameFilter;
}


When using JavaScript/React I just call XMLHttpRequest.abort() for all ongoing XHR's.


I cannot figure out how to do this in Tapestry 5.4.4. I was looking for AjaxResponseRenderer addRender(ClientBodyElement zone, abortPrevious);

S-E