https://htmx.org logo
Join Discord
Powered by
# 🔥-django-htmx
  • r

    red-dinner-66239

    10/30/2022, 12:56 PM
    yes
  • h

    hundreds-camera-24900

    10/30/2022, 9:29 PM
    you could use hx-refresh to refresh the page: https://htmx.org/reference/#response_headers
  • w

    white-motorcycle-95262

    11/01/2022, 12:37 PM
    Has anyone seen/put together an outline for how to do multi-part forms in Django+HTMX? I'm trying to decide if I should be using multiple FormViews, a single View that returns multiple forms, etc
  • w

    white-motorcycle-95262

    11/01/2022, 12:40 PM
    I think in an older parlance, what I'm looking to do is a "Wizard Form"
  • b

    bitter-monkey-50309

    11/01/2022, 2:58 PM
    We've used formtools at work quite successfully.
  • w

    white-motorcycle-95262

    11/01/2022, 3:08 PM
    Yeah, I just looked into that package. I'm trying to decide if it's worth it just for a single Wizard. Also, it seems like it only does database writing at the very end, but I'd need to do some for each step. I'm sure there's a way to do that though
  • h

    hundreds-camera-24900

    11/01/2022, 3:16 PM
    formtools used to be builtin but was split out - I think that's the first thing I'd reach for when making a wizard
  • w

    white-motorcycle-95262

    11/01/2022, 3:43 PM
    huh, didn't know that. Thanks 🙂
  • b

    best-barista-27777

    11/01/2022, 4:50 PM
    I use the django-formtools SessionWizardView. You can use WizardView.process_step or I have used a HTMX view in place of a wizard step form to save the data for that step and have it ready for the next.
  • w

    white-motorcycle-95262

    11/01/2022, 4:57 PM
    Yeah, I think that's what I'm going to go with, thanks 🙂
  • b

    blue-gold-89534

    11/01/2022, 6:07 PM
    yes, I know that. but I like it that way. No real reason 🙂
  • b

    blue-gold-89534

    11/01/2022, 6:10 PM
    I want an icon that on click checks something in the background and answers with - OK icon and the start of a download on success of the background check or - a NOK icon
  • b

    breezy-minister-64652

    11/02/2022, 1:38 PM
    Hi guys! I'm thinking about making an undo/redo button, and basically I'd like to know if any of you has ever done that before using htmx, and how you would recommend to achieve it
  • b

    breezy-minister-64652

    11/02/2022, 1:41 PM
    Currently I have one primary model with multiple "sub" models tied in a many-to-one relationship to it. My goal would be that, each time something within that primary model is edited, the changes are stored in a separate model, so an user could undo or redo changes as many times as he wishes
  • b

    breezy-minister-64652

    11/02/2022, 1:41 PM
    Is there any tools anyone would know that would help for this ? Maybe even related to htmx ? Thanks !
  • b

    bitter-monkey-50309

    11/02/2022, 2:28 PM
    Check out django-simple-history for tracking changes to models and doing diffs
  • b

    breezy-minister-64652

    11/02/2022, 5:20 PM
    Thank you very much! I'll check that out
  • b

    blue-gold-89534

    11/04/2022, 8:09 AM
    anyone an idea for that? My work-around would be to deliver some js with the hx-get reply that auto starts the download? Is that smart?
  • b

    bitter-monkey-50309

    11/04/2022, 7:46 PM
    I don't think htmx is a good fit for file downloads (may be mistaken as I've never tried it myself but I'm sure it's something I've read before too). Perhaps you can respond with the content of the image to update and a
    HX-Redirect
    header to the file download location. Though I'm not 100% on the order of swaps and redirect headers, but worth a shot.
  • b

    blue-gold-89534

    11/05/2022, 8:43 AM
    I wanted to do exactly that. But I was somehow confused on how to use
    hx-redirect
    as I found out from the comments here. So what I tried: - have a tag with a
    hx-get
    to get the response image - fail: NOK image swapped in - success: OK image AND a
    hx-redirect
    swapped in It is probably not that easy. Another thing I saw, but did not try was
    hx-location
    - but the problem I had was, the swapped in
    hx-redirect
    does not do anything. So what can I swap in, that triggers the redirect to the download?
  • b

    bitter-monkey-50309

    11/05/2022, 3:53 PM
    Are you putting
    hx-redirect
    in your HTML or as a header in the response?
  • b

    blue-gold-89534

    11/05/2022, 7:21 PM
    I did put it in my response
  • w

    wide-airport-20686

    11/07/2022, 9:02 PM
    Hey folks, any examples of using HTMX with form.in_valid in a generic class based view? I'm trying to reload the form with errors. I'd love a way to use the generic forms engine instead of having to manually write everything. Any ideas?
  • r

    red-france-69804

    11/08/2022, 3:16 PM
    If it can help, I built a specific mixin to be used with form validation for create/update generic views. It looks like this:
    Copy code
    python
    class HTMXCreateOrUpdateMixin(RefreshTableMixin, EmptyResponseMixin):
        """As create and update operations share almost the same logic, it makes sense
        to gather this logic into a mixin to avoid repetition.
        Note this is a mixin, and can not be used as is like a View.
        """
    
        form_class = None
        form_template_name = None
        hx_target_form_invalid = None
    
        def get(self, request, *args, **kwargs):
            check_not_none(self, "form_class", "form_template_name")
            context = self.get_context_data()
            return render(request, self.form_template_name, context)
    
        def post(self, request, *args, **kwargs):
            check_not_none(self, "form_class", "form_template_name", "hx_target_form_invalid")
            form = self.get_form()
            context = self.get_context_data(form=form)
            if form.is_valid():
                obj = form.save()
                response = self.build_response(request)
            else:
                response = render(request, self.form_template_name, context)
                response["HX-Reswap"] = "outerHTML"
                response["HX-Retarget"] = self.hx_target_form_invalid
    
            return response
  • r

    red-france-69804

    11/08/2022, 3:17 PM
    Then I inject this mixin in my generic views like this:
    Copy code
    python
    class ProposalCreate(LoginRequiredMixin, HTMXCreateView):
        model = FakeProposal
        form_class = ProposalForm
        form_template_name = "proposals/proposal_create_fragment.html"
        hx_target_form_invalid = "#fragment_create_proposal"
    
    
    class ProposalUpdate(LoginRequiredMixin, HTMXUpdateView):
        model = FakeProposal
        form_class = ProposalForm
        form_template_name = "proposals/proposal_update_fragment.html"
        hx_target_form_invalid = "#fragment_update_proposal"
  • r

    red-france-69804

    11/08/2022, 3:19 PM
    Note that this mixin is very specific to my needs and could not work if you just copy paste it. You can use it as an inspiration. Feel free to PM if you have question @wide-airport-20686
  • w

    wide-airport-20686

    11/08/2022, 4:25 PM
    This is great. Thanks for the heads up. I'm going to take a look later this week and see how I can tweak it. I love this: response = render(request, self.form_template_name, context) response["HX-Reswap"] = "outerHTML" response["HX-Retarget"] = self.hx_target_form_invalid
  • w

    wide-airport-20686

    11/08/2022, 4:25 PM
    Nice touch!
  • b

    blue-gold-89534

    11/08/2022, 7:26 PM
    I did put it in my response
  • f

    fancy-elephant-10660

    11/09/2022, 12:01 PM
    patterns! I'm not sure if I do correct pattern. When I have a form or action I have hx-trigger="..." hx-swap="outerHTML", hx-get="..." hx-target="..." the hx-target limit what I can return so I my view when there is an error the hx-target is going to replace the form. However when the form is correct then the hx-target needs to be for example the table to update that table. Or a row in a table. Currently I put triggers on the table hx-trigger="reload from:body" hx-get="..." and in the view when the form is success I send a response with reload that table My question: is there a better pattern?
1...818283...100Latest