Как удалить запись из queryset в html-шаблоне django без обновления страницы?

На моем HTML шаблоне я печатаю список из моего QuerySet, который я передал из views.py в Django. Я хочу, чтобы пользователи могли удалить запись из списка, не обновляя страницу. Как мне это сделать?

urls.py - path("del_trans/<int:trans_num>", views.delete_transaction, name="delete_transaction")

views.py

def delete_transaction(request, trans_id):
    user = User.objects.get(username=request.user)

    transaction = Transaction.objects.get(ruser=user, id=trans_id)

    transaction.delete()

    return HttpResponse(status=204)

trans.html

<tr id="trans-{{t.id}}">
    <td>{{ t.name }}</td>
        
    <td><button class="btn" onclick="delete_trans({{t.id}})"><span style="cursor:pointer;
            color:blue;
            text-decoration:underline;">Delete</span></button></td>
</tr>

index.js

function delete_trans(id) {
    fetch(`/del_trans/${id}`, {
        method: 'PUT',
        body: JSON.stringify({
            trans_id: id
        })
    });

    document.querySelector('#trans-' + id).style.display = 'none';
}

Вернуться на верх