https://htmx.org logo
Join Discord
Powered by
# 🔥-django-htmx
  • m
    is the example page working for you? I wonder if there is some other script that is interfering w/ sweet alert
  • n
    Hello, guys any help please how to set default hx-headers ['X-CSRF-TOKEN' => csrf_token()]])> im using Laravel
  • m
    This might help: document.body.addEventListener('htmx:configRequest', (event) => { event.detail.headers['X-CSRFToken'] = '{{ csrf_token }}'; })
  • m
    Or this: ...
  • b
    How do I include the value of the button being clicked in my form? I have 'Previous' and 'Next' buttons. Both submit a post request to the same view. I want to include the value of the clicked button ('previous' or 'next') with the POST request. How do I do this and access it in the django view?
  • e
    You could use an 
    hx-vals
    attribute on the previous and next button to send along the extra value. https://htmx.org/attributes/hx-vals/
    Copy code
    html
<button hx-vals="{goTo: 'next'}">Next</button>
<button hx-vals="{goTo: 'prev'}">Previous</button>
    or use 
    hx-include
    on each button with a hidden input for each
    Copy code
    html
<input id="next-input type="hidden" name="goTo" value="next">
<input id="previous-input" type="hidden" name="goTo" value="prev">
<button hx-include="#next-input">Next</button>
<button hx-include="#previous-input">Previous</button>
  • e
    Another way is to have a separate view for "next" and "previous," so one button would have 
    hx-post="/next"
    and the other would have 
    hx-post="/prev"
    . Then you can handle the logic server side
  • e
    I am not positive these options work if your 
    hx-post
    attribute is on the 
    form
    element; I have made the post request from the button and then used 
    hx-include
    to include all form values plus the button value.
  • b
    Thanka a lot! I have tried hx-include, hx-vals etc. and just couldn't get it working. Opted for two separate views in the end!
  • n
    onchange input inside form, it submit the whole form is that normal ? ....others inputs.... <input class="form-check-input" hx-post="/activate hx-trigger="change" hx-target="#alert_response" type="checkbox" role="switch" name="pro">
  • c
    Morning/Afternoon, I am using HTMX to refresh a table on my page with a Class Based ListView, if i navigate back using the back button I just get the result of that HTMX request and not page or the styling, if there a way to tell the view to render whole page when navigating back?
  • c
    Copy code
    class RolesList(ListView):
    model = Role
    template_name = 'workers-roles.html'
    # context_object_name = 'roles'

    def get_template_names(self):
        if self.request.htmx:
            return 'partials/roles_list.html'
        return self.template_name
    
    def get_context_data(self, **kwargs):
        # Call the base implementation first to get a context
        context = super().get_context_data(**kwargs)
        # Add in a QuerySet of all the Roles
        context['roles'] = Role.objects.all().order_by('name')
        return context
  • r
    if self.request.htmx and not self.request.htmx.history_restore_request:
  • c
    Thanks, still have the issue.
  • a
    Hey guys, I need help with getting a class-based view to properly redirect to 
    success_url
    . I have a contact form with a confirmation view.
    Copy code
    python
class ContactPageView(FormView):
    template_name = 'contact_page.html'
    base_template = 'contact_form_partial.html'
    extra_context = {'base_template': base_template}
    form_class = ContactForm
    success_url = '/confirm/'


class ConfirmationView(FormView):
    template_name = 'confirmation_page.html'
    base_template = 'contact_form_partial.html'
    extra_context = {'base_template': base_template}
    form_class = ContactForm
    submit = False
    success_url = '/success/'

    def post(self, request, *args, **kwargs):
        if self.submit is True:
            form_class = self.get_form_class()
            form = self.get_form(form_class)
            if form.is_valid():
                self.form_valid(form)
        return render(self.request, self.template_name, self.get_context_data())

    def form_valid(self, form):
        form.send()
        return super().form_valid(form)


class SuccessView(TemplateView):
    template_name = 'success_page.html'
    base_template = 'contact_form_partial.html'
    extra_context = {'base_template': base_template}
    My template with HTMX looks like this:
    Copy code
    html
<form>
        {% for field in form %}
            <div>
            {{ field.as_hidden }}
            {{ field.label }}:
            {{ field.value }}
            </div>
        {% endfor %}
        <button hx-post="send/"
                hx-target="#contact-form"
                hx-swap="outerHTML"
                type="submit">
            Send
        </button>
    </form>
    The form will successfully send an email, but it won't redirect to the 
    success_url
    (ie the 
    #contact-form
    element isn't replaced with the 
    success_page.html
    template)
  • a
    I can get everything to run fine with function-based views.
  • a
    Copy code
    python
class ConfirmationView(FormView):
success_url = '/success/'

    def form_valid(self, form):
        form.send()
        # I feel like I'm missing something here.
        return super().form_valid(form)
    My expectation is that 
    return super().form_valid(form)
    should redirect to the 
    success_url
    specified in 
    ConfirmationView
    .
  • a
    I've also tried:
    Copy code
    python
def form_valid(self, form):
    ...
    return render(...)
    and
    Copy code
    python
def form_valid(self, form):
    ...
    return redirect(self.success_url)
  • a
    I found my problem. It was in `post`:
    Copy code
    python
class ConfirmationView(FormView):
    ...
    def post(self, request, *args, **kwargs):
        ...
            if form.is_valid():
                # Add return
                return self.form_valid(form)
        return render(self.request, self.template_name, self.get_context_data())
  • c
    hello, im building a django chat messages view and trying to use SSE with htmx, but i didnt understand what is the event name (new_news) in this htmx doc example:
  • s
    has anyone here come up with a clean way to handle session expiration? I'm doing an htmx request, but if the session has expired I want to redirect them to the login page. Currently the whole login page gets rendered, since I protect my views with a @login_required, and then swapped into the hx-target creating a "pageception". A couple of ways I'm thiking would fix this: 1) wrap django's 
    login_required
    with my own logic that adds a 
    HX-Redirect=/login
    to the response in case we need to re login 2) have the login view return a 
    HX-Retarget=body
    to have the content be swapped by the whole page. 3) any other ideas?
  • b
    Middleware to check the response and if it's a redirect to the login page (and it's a htmx request) then do a 
    HX-Redirect
    ?
  • s
    That's not a bad idea! I wonder if it'll be too magical and people in a year won't know how it's happening
  • s
    So far I've done the HX retarget and things seem to be working btw
  • s
    Anyone ever tried hx websocket extension in spring boot?
  • s
    I released a new version of my tiny html_form_to_dict() library: https://github.com/guettli/html_form_to_dict This is a tiny library which provides a method called html_form_to_dict(). This method takes a string containing HTML and returns a dictionary of the values of the first form. The data returned by html_form_to_dict() is a FormDict which has the method submit(). This way you can submit the data like a real browser would. This mean you can do simple end-to-end testing of form handling without a real browser (like selenium/puppeteer/playwright). Feedback is welcome
  • m
  • m
    What’s django version of inline fragments? Is it include tag? https://docs.djangoproject.com/en/4.1/ref/templates/builtins/#include
  • h
    yeah that or django-components
  • r
1...697071...100Latest