Django, htmx удаление записи и обновление

Итак, у меня есть список в частичном шаблоне Django.

<div class="col">
    <div class="row pb-2" id="rowcolor">
        <div class="col border-bottom">
            pk:{{ color.pk }} / name:{{ color.description|title }}
        </div>
        <div class="col-auto">
            <button hx-delete="{% url 'delete-color' pk=color.pk %}" hx-target="#rowcolor" hx-swap="outerHTML"
                class="btn btn-outline-secondary btn-sm float-end" type="button">Delete</button>
        </div>
    </div>
</div>

enter image description here

При удалении pk149/name3: pk147 / name1 исчезает.

При обновлении все правильно. pk:149 исчез.

Вид выглядит следующим образом:

@require_http_methods(["DELETE"])
def delete_color(request, pk):
    if request.htmx:
        Color.objects.get(pk=pk).delete()

        return HttpResponse("")

Я пытался прочитать документацию по htmx. Но я ничего не понимаю. Может ли кто-нибудь указать мне правильное направление?

Не присваивайте один и тот же id нескольким элементам: сделайте элементы уникальными, например, добавив к ним первичный ключ:

<div class="col">
    <div class="row pb-2" id="rowcolor{{ color.pk }}">
        <div class="col border-bottom">
            pk:{{ color.pk }} / name:{{ color.description|title }}
        </div>
        <div class="col-auto">
            <button hx-delete="{% url 'delete-color' pk=color.pk %}" hx-target="#rowcolor{{ color.pk }}" hx-swap="outerHTML"
                class="btn btn-outline-secondary btn-sm float-end" type="button">Delete</button>
        </div>
    </div>
</div>

Возможно, вы сможете немного повысить эффективность представления, используя:

@require_http_methods(['DELETE'])
def delete_color(request, pk):
    if request.htmx:
        Color.objects.filter(pk=pk).delete()
        return HttpResponse('')
Вернуться на верх