fix: trigger species search on button click, not on input change

Avoids burning Perenual API quota on every keystroke.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Stephan Kerkman 2026-05-28 10:23:45 +02:00
parent 4b1212c5ec
commit 34f6c3652e

View file

@ -4,17 +4,23 @@
<h5 class="mb-3">Add a plant</h5> <h5 class="mb-3">Add a plant</h5>
<p class="text-muted small">Search for the species to auto-fill care info, or skip to enter details manually.</p> <p class="text-muted small">Search for the species to auto-fill care info, or skip to enter details manually.</p>
<input <div class="input-group mb-2">
<input
type="search" type="search"
class="form-control mb-2" class="form-control"
placeholder="🔍 Search species, e.g. 'climbing rose'" placeholder="e.g. 'climbing rose'"
name="q"
id="species-q"
autocomplete="off"
>
<button
class="btn btn-success"
hx-get="{% url 'species_search' %}" hx-get="{% url 'species_search' %}"
hx-trigger="input changed delay:400ms" hx-include="#species-q"
hx-target="#species-results" hx-target="#species-results"
hx-swap="innerHTML" hx-swap="innerHTML"
name="q" >Search</button>
autocomplete="off" </div>
>
<div id="species-results" class="list-group mb-3"></div> <div id="species-results" class="list-group mb-3"></div>