[HTMX - Django] "popup" de confirmation de suppression

Salut,

J'ai implémenté (improvisé?) avec HTMX un message "popup" qui demande confirmation lors de la supression d'un élément.
Ça a l'air de bien fonctionner. Je vais essayer de décrire le plus clairement possible comment je m'y suis pris.

Si vous pouvez me faire un retour, pour savoir si l'implémentation reste correcte et il y a deux choses sur lesquelles je ne suis pas trop sûr :

• La vue PostDetail qui hérite de deux classes : DetailView et DeleteView.

• Le bouton Annuler qui recharge la vue détail de l'article dans le body, il y a peut-être une meilleur solution ?

J'ai effectué différents tests de sécurité afin de vérifier qu'on ne puisse pas supprimer l'article en "jouant" avec l'URL.

Le but est de faire aparaître au centre de l'écran la vue qui contient le formulaire de confirmation, donc c'est sans utiliser le popup du navigateur avec hx-confirm.

Les vues

Le bouton de supression est accessible sur la vue détail d'un article. Cette vue est une CBV qui hérite de DetailView et DeleteView) :

class PostDetail(DetailView, DeleteView):
    model = Article
    context_object_name = "post"
    template_name = "posts/post_detail.html"
    success_url = reverse_lazy("posts:home")
    ...

La vue qui contient le formulaire de confirmation :

@login_required
def delete_confirm(request, slug):
    post = Article.objects.get(slug=slug)
    return render(request, "posts/confirm_delete.html", {"post": post})

La partie HTMX

• Dans un premier temps, j'ai ajouté un div conteneur qui sera remplacé par un div (stylisé) contenant le formulaire, qui pop au centre de l'écran :
  

  <div id="htmxContainer"></div>
  

• Le bouton de suppression :

• Le template du formulaire :
  

J'espère n'avoir rien oublié !
Merci ;)

Salut Cam !

On rentre dans le dur avec HTMX là :) Je me souviens avoir eu pas mal de questions sur ces sujets là quand on sort un peu du cadre simple d'une requête unique avec un retour simple.

Déjà petit conseil : crée des méthodes dans tes modèles pour les URL, c'est plus versatile et ça permet de changer ça à un seul endroit si jamais tu changes quelque chose (par exemple si tu passes par un PK au lieu d'un slug par la suite pour tes articles).

Par exemple :

from django.urls import reverse

def get_delete_confirm_url(self):
    return reverse('posts:delete-confirm", kwargs={"slug": self.slug})

Et après dans ton template tu fais juste {{ post.get_delete_confirm_url }}. J'utilise ce nom pour faire écho au get_absolute_url qui est utilisé par l'admin (https://docs.djangoproject.com/en/4.2/ref/models/instances/#django.db.models.Model.get_absolute_url).

Autre petit détail que je vois : pas besoin de mettre un hx-trigger = click sur un bouton, c'est le comportement par défaut ;)

Si je comprends bien, le bouton permet de supprimer juste un élément de l'article (et pas l'article au complet) c'est ça ?

Et du coup tu recharges dans le body l'article au complet, minus l'élément qui a été supprimé ?