Open Ragudos opened 7 months ago
It works when I have this markup instead:
<input name="search" value="{{query}}" hx-get="/discover/api"
hx-target="#section-of-communities"
hx-include="[name='category']"
hx-sync="[name='category']:replace"
id="search-input" type="search" name="search"
title="Search by name" placeholder="Search by name"
autocomplete="off" autocapitalize="off"
hx-trigger="keyup changed delay:250ms, search"
hx-indicator="#search-loader" />
<label aria-label="{{value}}" class="btn category-filter">
<input type="radio" name="category" value="{{value}}"
hx-get="/discover/api" hx-trigger="change"
hx-include="#search-input"
hx-sync="[name='category']:replace"
hx-target="#section-of-communities"
hx-target-error="#nothing" />
<span>{{name}}</span>
</label>
I only left [name='category']:replace on both search input and category filter radio buttons. The problem is, they also sync with the search input despite only having [name='category'].
I have a markup that contains a search input and tabs of category filters which are radio buttons with a change handler:
Expectation: Abort a previous request of elements with attributes [name=category] and id of search-input if we submit a new request.
What's going on:
https://github.com/bigskysoftware/htmx/assets/133567781/297b8a2f-3467-4133-9e66-faecf9460e46