bigskysoftware / htmx

</> htmx - high power tools for HTML
https://htmx.org
Other
35.47k stars 1.19k forks source link

HTMX 2.0 with multiswap selectors after first not found #2662

Open TudorHulban opened 3 weeks ago

TudorHulban commented 3 weeks ago

hi! with htmx and multiswap 2.0 the below response from a go backend reports that

multi-swap.js:36 HTMX multi-swap: selector '#itemstbl-head' not found in source content.
HTMX multi-swap: selector '#itemstbl-body' not found in source content.

backend response:

<div id="container-search"><h3>Search / Create Tickets</h3><form id="items-search" hx-target="#itemstbl-body" hx-swap="outerHTML"><div class="form-group">
<label for="id">ID:</label>
<input type="text" id="items-search-id" name="id"></div><div class="form-group">
<label for="status">Status:</label>
<input type="text" id="items-search-status" name="status"></div><div class="form-group">
<label for="name">Name:</label>
<input type="text" id="items-search-name" name="name"></div><button type="submit" hx-post="/ticket">Create</button><button type="submit" hx-post="/tickets">Search</button></form></div>
<thead><tr id="itemstbl-head"><th>#</th><th>ID</th><th>Name</th><th>Status</th><th>Opened By</th><th>Last Update</th></tr></thead>
<tbody id="itemstbl-body"><tr><td>1</td><td>17183655314406920001</td><td><a href="/17183655314406920001">Ticket 4531</a><td>New</td><td>John Doe</td><td>2024, June 14 HH14:45:31</td></tr><tr><td>2</td><td>17183737278406920001</td><td><a href="/17183737278406920001">t1</a><td>New</td><td>John Doe</td><td>2024, June 14 HH17:02:07</td></tr><tr><td>3</td><td>17183746410406920001</td><td><a href="/17183746410406920001">t2</a><td>New</td><td>John Doe</td><td>2024, June 14 HH17:17:21</td></tr><tr><td>4</td><td>17188763319821830001</td><td><a href="/17188763319821830001">t2</a><td>New</td><td>John Doe</td><td>2024, June 20 HH12:38:51</td></tr><tr><td>5</td><td>17188765338821830001</td><td><a href="/17188765338821830001">t3</a><td>New</td><td>John Doe</td><td>2024, June 20 HH12:42:13</td></tr></tbody>

the backend is triggered with:

<li><a href="#" hx-ext="multi-swap" hx-get="/tickets" hx-swap="multi:#container-search,#itemstbl-head,#itemstbl-body:innerHTML" class=""><span class="material-symbols-outlined">call</span>Tickets</a></li>

I have tried separately by serving only one multiswap selector at a time and the swap works. please advise what could be wrong. thank you

nullwriter commented 3 weeks ago

you do realise this project is a joke? The author made this as a joke to bring attention to how people get into tools and dont understand it... lol

Telroshan commented 3 weeks ago

Htmx sucks, btw