stephan/bloombase
1
0
Fork 0
Code Issues 9 Pull requests Projects Releases Packages Wiki Activity Actions

fix: use hx-swap=innerHTML so #photo-gallery id survives HTMX swaps

Browse source
This commit is contained in:
Stephan Kerkman 2026-05-30 21:36:54 +02:00
parent be9d6caf94
commit 1a9aa24ebf
1 changed files with 3 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
plants/templates/plants/partials/photo_gallery.html
View file

@ -13,7 +13,7 @@
{% if not photo.is_thumbnail %} {% if not photo.is_thumbnail %}
<form method="post" action="{% url 'set_thumbnail' photo.pk %}" <form method="post" action="{% url 'set_thumbnail' photo.pk %}"
hx-post="{% url 'set_thumbnail' photo.pk %}" hx-post="{% url 'set_thumbnail' photo.pk %}"
hx-target="#photo-gallery" hx-swap="outerHTML"> hx-target="#photo-gallery" hx-swap="innerHTML">
{% csrf_token %} {% csrf_token %}
<button type="submit" class="btn btn-outline-success btn-sm py-0 px-1" style="font-size:.7rem;" title="Set as thumbnail">★</button> <button type="submit" class="btn btn-outline-success btn-sm py-0 px-1" style="font-size:.7rem;" title="Set as thumbnail">★</button>
</form> </form>
@ -22,7 +22,7 @@
{% endif %} {% endif %}
<form method="post" action="{% url 'delete_photo' photo.pk %}" <form method="post" action="{% url 'delete_photo' photo.pk %}"
hx-post="{% url 'delete_photo' photo.pk %}" hx-post="{% url 'delete_photo' photo.pk %}"
hx-target="#photo-gallery" hx-swap="outerHTML"> hx-target="#photo-gallery" hx-swap="innerHTML">
{% csrf_token %} {% csrf_token %}
<button type="submit" class="btn btn-outline-danger btn-sm py-0 px-1" style="font-size:.7rem;" title="Delete">✕</button> <button type="submit" class="btn btn-outline-danger btn-sm py-0 px-1" style="font-size:.7rem;" title="Delete">✕</button>
</form> </form>
@ -34,7 +34,7 @@
{% endwith %} {% endwith %}
<form method="post" action="{% url 'upload_photo' plant.pk %}" enctype="multipart/form-data" <form method="post" action="{% url 'upload_photo' plant.pk %}" enctype="multipart/form-data"
hx-post="{% url 'upload_photo' plant.pk %}" hx-target="#photo-gallery" hx-swap="outerHTML" hx-post="{% url 'upload_photo' plant.pk %}" hx-target="#photo-gallery" hx-swap="innerHTML"
hx-encoding="multipart/form-data" hx-indicator="#photo-upload-spinner"> hx-encoding="multipart/form-data" hx-indicator="#photo-upload-spinner">
{% csrf_token %} {% csrf_token %}
<div class="d-flex gap-2 align-items-center flex-wrap"> <div class="d-flex gap-2 align-items-center flex-wrap">
@ -45,15 +45,3 @@
</div> </div>
</form> </form>
</div> </div>
{% if request.htmx %}
<div id="plant-hero-container" hx-swap-oob="true">
{% if plant.species and plant.species.api_image_url %}
<img src="{{ plant.species.api_image_url }}" class="plant-hero rounded mb-3" alt="{{ plant.species.common_name }}">
{% elif plant.thumbnail_url %}
<img src="{{ plant.thumbnail_url }}" class="plant-hero rounded mb-3" alt="{{ plant.name }}">
{% else %}
<div class="plant-hero-placeholder rounded mb-3">🌿</div>
{% endif %}
</div>
{% endif %}