https://htmx.org logo
Join Discord
Powered by
# 🔥-django-htmx
  • h
    one of the benchmarks they focused on is django template rendering
  • h
    so django users should see a speed up when upgrading
  • h
    also the improved error locations are great
  • w
    So currently I'm using 
    <body hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
    to set the token, but this results in an outdated token when users log in/out (I believe both of those actions result in Django cycling the CSRF Token). How are other people refreshing the token for HTMX in these situations?
  • w
    Sorry I'm trying to find the context of this, are you saying that Django 4 focused on faster template rendering?
  • m
    No it's Python 3.11 that focused on getting faster at what's necessary to Django template rendering.
  • w
    Oh, wow. Interesting. So this improvement should apply to all (recent) versions of Django?
  • h
  • h
    LTS and above for sure.
  • w
    Yeah, I thought this would probably be the best way to do it. I think I was niave when I hoped the hx-headers would work :)
  • r
  • r
    tl;dr: use 2 cookies. 1 strict, 1 lax
  • s
    I usually put it along with the 
    hx-post
    as part of the request wherever the form is, it's something you already had to do if you were to use regular forms anyway (that's my reasoning)
  • w
    Right, but if you do that then your token might be incorrect if a log in/out occurs, since Django cycles the token then. I think the only way to do it reliably is to use 
    getCookie
  • s
    Oh I see, and the forms do not require you to be logged in?
  • w
    Well, in my case I have e.g. a multi-part form that either makes you sign up for an account or log into an account before showing a purchase form. If they log in, the CSRF token cycles, so any token hard-coded into the template would be expired, so I have to use getCookie
  • a
    Hi, i try to use 
    hx-delete
    in combination with a Django 
    DeleteView
    from a 
    TemplateView
    (with a list of items). Everything is working fine, without the redirect after the delete. I get a 302 for the delete but then i get an 405 on my 
    TemplateView
    . I'm not sure why the redirect does a HTTP DELETE on my 
    TemplateView
    .
  • i
    I had to subclass BaseDeleteView and define delete() myself. The default implementation sends a RedirectResponse to get_success_url(), which indeed results in a 405 because that request is sent via DELETE. I’m not sure this request is made by HTMX. I don’t think the HTTP spec allows preserving DELETE when redirecting; the method should be converted to GET. Anyway, so I implemented a custom delete() that returns a partial template (eg new HTML for a table when deleting a row) instead of redirecting.
  • i
    Update: no, actually on 302 the HTTP spec states that clients should make an otherwise identical request to the new URL specified by Location. Browsers used to automatically use GET which was a faulty implementation, which is why 303 and 307 were added: 303 mandates making a new request using GET, while 307 mandates keeping the same method. Anyway, I think sending actual HTML is best if you do need the DELETE endpoint to swap actual content (if it only needs to drop some content then return nothing and use swap=delete I suppose?).
  • a
    Thank you, now its working :). Here is my solution if someone has the same problem. First the HTMX Part
    Copy code
    hx-delete="{% url 'deletebooking' booking.id %}"
hx-confirm="Are you sure you want to delete this item."
hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
hx-target="#booking-{{ booking.id }}"
hx-swap="outerHTML"`
    And here is my "DeleteView"
    Copy code
    python
class DeleteBookingView(LoginRequiredMixin, BaseDetailView):
    http_method_names = ['delete']
    model = Booking

    def delete(self, request, *args, **kwargs):
        self.object = self.get_object()
        if self.object.user == self.request.user:
            self.object.delete()
            response = redirect(reverse_lazy('dashboard'))
            response.status_code = 200
            return response
        else:
            raise PermissionDenied()
  • i
    So are you returning an empty HTTP 200 response with the Location set to that dashboard view? Does htmx fetch that and paste the new content? I’m a bit confused. My solution would have been to actually render() the dashboard HTML
  • a
    Yeah, i swap my row div with an empty result. I dont have to render the full list again. I forgot the hx-swap in my first example and edited it now.
  • a
    How can I use htmx inside a django form?
  • a
    yeah, so problem number 1 is how to put the htmx in the form html, because with django it just looks like: {{form}}
  • a
    I found widget tweaks, but I'm not sure if that's the best way
  • a
    problem number 2 is that even though I put the htmx inside the widget tweaks tag like this:
  • a
    Copy code
    {% render_field league_form.mtgFormat name="leagueformat" class="form-control" hx-trigger="change, load" hx-post="/account/enable" hx-target="#myDeck" %}
  • a
    and it outputs html like this:
  • a
    Copy code
    <select class="form-control" hx-post="/leagues/formatdecks" hx-target="#myDeck" hx-trigger="change, load" id="id_mtgFormat" name="leagueformat" required="">
  • a
    it still doesn't work. I get no post request when I load or change that selection
1...616263...100Latest