Django & HTMX - Dynamic Form Creation and Submission

แชร์
ฝัง
  • เผยแพร่เมื่อ 19 ม.ค. 2025

ความคิดเห็น • 111

  • @立法院很忙
    @立法院很忙 ปีที่แล้ว +10

    Whenever I see new BugBytes videos, I click "like" first, before grabbing a drink to go along with watching the video. 😁

  • @AmoahDevLabs
    @AmoahDevLabs ปีที่แล้ว +5

    I can't believe you're still doing these tutorials. Your work is beyound expectations. To be frank with you, "You're very much sefless". You always enlighten people. This is what I call the TRUE GOSPEL. I really appreciate all your works.

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thanks a lot! Means a lot, thank you.

  • @lucidcatnap
    @lucidcatnap ปีที่แล้ว +3

    Subscribed for the amazing combination of relevant web development content and a Scottish accent

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thank you, and greetings from Glasgow! 😄

  • @aleksmith2808
    @aleksmith2808 ปีที่แล้ว +6

    Came from another one of your videos, you can't imagine my relief when I saw you also do htmx tutorials. Keep up the great work, love the Django and HTMX content

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thanks a lot Alek! Glad you're liking the content - will keep going 💪

  • @ABMA79
    @ABMA79 3 หลายเดือนก่อน

    One of the best tutorials I have seen so far for you....
    Thanks a lot.

    • @bugbytes3923
      @bugbytes3923  2 หลายเดือนก่อน

      Thanks a lot, glad you liked it!

    • @ABMA79
      @ABMA79 2 หลายเดือนก่อน

      @@bugbytes3923 I hope you can design an e-commerce website and make it as a series of tutorials. You are among the best in terms of explaining the steps.

  • @bitpilot79
    @bitpilot79 ปีที่แล้ว +2

    You have the best videos on HTMX. Thanks for sharing.

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thanks a lot, appreciate it!

  • @trosgate
    @trosgate ปีที่แล้ว +3

    I have no doubt that this teacher will reach 10,000 users in no time. Simple reason is that he knows how to implement and utilize the capabilities of external packages

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thanks a lot for the nice comment, really appreciate it!

  • @graczew
    @graczew ปีที่แล้ว +4

    Your content is a pure gold mate. Thanx for your time and effort to make this.

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thanks a lot mate. Glad it's being well received!

    • @graczew
      @graczew ปีที่แล้ว

      @@bugbytes3923 I'm follow your channel for longer time and content is really useful. I just hope you will not stop make django content.

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      @@graczew Thanks a lot for the support over the time, Krzysztof. Django will always be a core part of the content, even with some other stuff mixed in.

  • @seydinaoumarsamabaly1806
    @seydinaoumarsamabaly1806 ปีที่แล้ว +2

    Master🙌🏾 , just a delight your tutorials from the day one till today. Thank for everything you're doing for others.

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว +1

      Thanks Seydina! Much appreciated!

  • @s.victor7740
    @s.victor7740 5 หลายเดือนก่อน +1

    This is awesome; keep on the good work. The video explains what I need to complete my project.

    • @bugbytes3923
      @bugbytes3923  5 หลายเดือนก่อน

      Glad to hear the video has helped! Thank you for the support!

  • @fernandtape9363
    @fernandtape9363 ปีที่แล้ว +6

    Welcome back HTMX. Great as always. Can't wait for the coming full project.

  • @Peterstavrou
    @Peterstavrou ปีที่แล้ว +1

    Another excellent video!

  • @craigphollingsworth1460
    @craigphollingsworth1460 ปีที่แล้ว

    Great video again! Really, really helpful. Would love to see a follow up on how you would handle validation on the multiple submit.
    cheers

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thanks a lot Craig!
      Will look into an extension of the video 👍

  • @ermalgashimramori
    @ermalgashimramori ปีที่แล้ว +1

    As always great great content.

  • @o3cloudng357
    @o3cloudng357 7 หลายเดือนก่อน

    Hello BugBytes, You have been amazing since I found your channel. Can you make a video on how to use htmx to update dynamic forms /formset like this one

  • @SkeechFab
    @SkeechFab ปีที่แล้ว +1

    Spectacular mate thx! How would you dynamically add more fields/rows to one form? For example, you want to add and number for some, but then want to add additional information, rows, for other contacts and the additional info isn't necessarily 'name' and 'number'.

  • @marcoroose9973
    @marcoroose9973 9 หลายเดือนก่อน

    Very nice! But what about form errors?

  • @nikoskalousis3523
    @nikoskalousis3523 หลายเดือนก่อน

    Great tutorial as always! Thank you very much! What if I have to present two different forms on the user but allow him/her to add rows only to one? Consider a Band - Musician app where in each entry there will be only one Band form and any number of musicians... Say:
    Band: Pink Floyd, Year Formed: 1965, Active: True
    Musician: David Gilmour, Instrument: Guitar
    etc.
    Is it better to use a formset for the Musician's instances?
    Thank in advance.

  • @DenisCardosoTutor
    @DenisCardosoTutor ปีที่แล้ว

    Great tutorial. Is there a way to does not show the "submit all" if there is no form to submit ?

  • @ayubkara1092
    @ayubkara1092 ปีที่แล้ว +1

    thank you as always for the great content , can't help but ask will you ever consider doing something about Django Channels maybe in the future ?

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว +1

      Thanks a lot! I did this video on Websockets + HTMX that uses Django-Channels.
      th-cam.com/video/FcVwDEcu6K0/w-d-xo.html
      There will be a full course on Channels this year at some point. I'll start planning this when I get some time in a few months.

  • @bal_mahmuda
    @bal_mahmuda ปีที่แล้ว

    mantap, makasih bug bytes. bagus banget nama channel nya.

  • @dovh49
    @dovh49 ปีที่แล้ว

    When working with vanilla forms like this `hx-boost=true` is a great attribute. As for having the button outside of the form you could simply use the `form` attribute, like this `Submit`.

  • @joey4uandme
    @joey4uandme 8 หลายเดือนก่อน

    Can this be used for a single field in a model? For example. You use htmx to display a field in a model on a form only when another model field choice is selected.

  • @JayJay-th3hd
    @JayJay-th3hd ปีที่แล้ว

    Nice work! Every video is very helpful to understand django and htmx!
    In this example it's possible to limit the number of forms where the user can create?
    hx-get="{% url 'create-contact' %}"
    hx-target="#contact-forms"

  • @UmutAlverGuclu-xg8ex
    @UmutAlverGuclu-xg8ex ปีที่แล้ว

    Thank you! How would you add inline editing - htmx?

  • @MalfuncEddie
    @MalfuncEddie ปีที่แล้ว +2

    Maybe an idea for the next video (django,htmx):
    How do you create a "wizard" where the questions influence each other.
    like
    formA yes/no question (Would you like to know more)
    if yes ->
    ask for mail(q1a)
    ask for name (q1b)
    --> go to formB
    if no ->
    go to form C
    formB yes/no question (Would you like to know our promo's)
    if yes: Ask more questions
    if no: go to end
    ....
    at the end I it should return a dict with
    { q1: true,
    q1a: "answer",
    q1b: "answer",
    q2: false,
    q2a: "",
    q2b: "",
    q3: ...
    }
    I know there are "questionaire" django projects but for some reason I can't get my head around them.

  • @UsGreg
    @UsGreg ปีที่แล้ว +4

    Please, make hx-boost tutorial :)

  • @95myou
    @95myou ปีที่แล้ว

    it would be really cool if you can add an auto-complete to form line :D BTW really cool content

  • @MrSelimOzkan
    @MrSelimOzkan 4 วันที่ผ่านมา

    Thanks for the great job you are doing to teach us better ways for coding. What about usinig this like inlineformset_factory. I mean editing the whole set, deleting previously submitted row from the set etc. can you please make a sample about using htmx with inlineformset_factory?

  • @eduardsanchez6962
    @eduardsanchez6962 ปีที่แล้ว

    greate tutorial OMG, just a question can this works with forenkyes, like add multiples instance of phone number of one person??

  • @iniasderoeck1345
    @iniasderoeck1345 7 หลายเดือนก่อน

    Could you a video on the htmx with django CBV and more advanced relations instead of 1 FK. I have a project im really struggling with... Kind regards

  • @kellyqiu7784
    @kellyqiu7784 ปีที่แล้ว +1

    Thank you! could you please also upload the starter code for this?

  • @zawanns
    @zawanns ปีที่แล้ว

    Thank you so much for your content, always helpful. I’ve just used this method and it works perfectly. And i’d like to know what if in the partial form we want to use django-select2 on one of the field. Thank you once more.
    😎

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว +1

      Thanks a lot! I'm not sure about django-select2 in this example, but could look into that in a future video perhaps.

  • @lordAvatar
    @lordAvatar ปีที่แล้ว

    Hej BugBytes, great vid as always.
    I can't seem to find your repo for this one, am I being dumb/crazy?

  • @amine63404
    @amine63404 10 หลายเดือนก่อน

    I am struggling with something, can you help please.
    How do we deal with forms errors.
    I am able to show them, but not able to remove them, because of when the form is valid, it's adding a new line but of course not removing the htmp errors tags.

  • @tofuman9526
    @tofuman9526 10 หลายเดือนก่อน

    I wonder. Would you build an app like Typeform with HTMX?
    Conceptually it seems like SPA approach is more suitable, just because it seems easier to build out.
    Even the display of the forms themselves, which in Typeform may include some logic, I.e rendering different forms acocording to answer provided…

  • @asqarsakenov
    @asqarsakenov ปีที่แล้ว

    How to make drop-downs which can fetch only the distinct values from psql? And next drop down in one row should depend on values of the previous choice and etc. I have to filter up the product price based on 4 filters like in excel and then fetch the corresponding price from DB to form an invoice. Thanks in advance!

  • @AliHassan-wc6nb
    @AliHassan-wc6nb ปีที่แล้ว

    Best thing you did ma'am, can we validate all Input value at once while sending all forms at once. . Like all debits must be equal to total credits. Hope you got my point.

    • @trosgate
      @trosgate ปีที่แล้ว

      In the widget, I think we can specify required=True to ensure that any form added is required. Htmx can be used to validate as well

  • @hakanbilgin6875
    @hakanbilgin6875 6 หลายเดือนก่อน

    thank you good informations.

  • @airborne.images
    @airborne.images 11 หลายเดือนก่อน

    I love your videos, but I can't get this one to work. When I click add, it duplicates the entire page with the h1 title and the green add button...

  • @xVeraldi
    @xVeraldi ปีที่แล้ว

    Would you be able to replace the Cancel button with an icon and have the same result using hx-on attribute?

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว +1

      Absolutely! Any icon with an hx-click trigger attached to it will work.

  • @ewyg
    @ewyg ปีที่แล้ว

    which one should I use? hyperscript or alpinejs...? seems like alpinejs is more popular and mature?

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Both are great choices. Alpine is probably more popular and mature, though.

  • @rokibulhaque1673
    @rokibulhaque1673 ปีที่แล้ว

    Hi, Can you please share a tutorial for nested form using Django & HTMX...!!!

  • @prezlamen
    @prezlamen 4 หลายเดือนก่อน

    Do you have source code of this app on git? I struggle to recreate this without error.

  • @VTym-tk8qr
    @VTym-tk8qr ปีที่แล้ว

    Hello. Thanks for the video lesson. As always, everything is at the highest level.
    Could you show how to complete the following task: a block with comments under the post, with sub-levels (replies to comments) and a separate block that adds up the number of comments. Thank you.

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thanks!
      That's an interesting suggestion. Will add to the list, but it would require a new video and some prep.

  • @umrana5946
    @umrana5946 9 หลายเดือนก่อน +1

    thanks alot

    • @bugbytes3923
      @bugbytes3923  9 หลายเดือนก่อน

      Thanks for watching!

  • @Igor160594
    @Igor160594 10 หลายเดือนก่อน

    you are the best

    • @bugbytes3923
      @bugbytes3923  10 หลายเดือนก่อน

      Thanks a lot, appreciate the comment!

  • @prezlamen
    @prezlamen 5 หลายเดือนก่อน

    Can this be done in flask?

    • @bugbytes3923
      @bugbytes3923  5 หลายเดือนก่อน

      It could be done in Flask, with a few alterations - switch the Django forms with WTForms, for one.
      flask.palletsprojects.com/en/3.0.x/patterns/wtforms/
      All the HTMX stuff can be done with Flask in a very similar manner.

    • @prezlamen
      @prezlamen 5 หลายเดือนก่อน

      @@bugbytes3923 Thank you! If I can suggest, try to increase font size for TH-cam.

  • @dimasarestu2043
    @dimasarestu2043 ปีที่แล้ว

    HTMX with django is really good, but how to validation all form, which if one form fail all form fail submit too

  • @albyunni8211
    @albyunni8211 ปีที่แล้ว

    This code is the one i am looking . can i get the code

  • @JishnuDedeepya
    @JishnuDedeepya ปีที่แล้ว

    How to get single submit button for all multiple forms to submit to the database

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      There's a "Submit All" button in the latter part of this video I think, to show how to submit all the forms on the page.

    • @JishnuDedeepya
      @JishnuDedeepya ปีที่แล้ว

      Submit all button is not working for my multiple orders to submit on click

  • @dglebable
    @dglebable 7 หลายเดือนก่อน

    Can you provide the source code you have created?

  • @dodokwak
    @dodokwak ปีที่แล้ว +1

    Thx.

  • @johnsonwambiru8497
    @johnsonwambiru8497 ปีที่แล้ว

    life saver thanks

    • @peterevance
      @peterevance ปีที่แล้ว

      Hello Johnson,
      What are you developing? 😅.

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      Thanks!

    • @johnsonwambiru8497
      @johnsonwambiru8497 ปีที่แล้ว

      @@peterevance a system for managing invoices and delivery notes so i need a way to add multiple items and save them at a go

    • @peterevance
      @peterevance ปีที่แล้ว

      @@johnsonwambiru8497 Ah , I see.
      @BugBytes had a video on something like that too. Something like Form Wizard tutorial.

  • @aafan.kuware
    @aafan.kuware 8 หลายเดือนก่อน +1

    🎉🎉🎉

    • @bugbytes3923
      @bugbytes3923  8 หลายเดือนก่อน +1

      Thanks!!

    • @aafan.kuware
      @aafan.kuware 8 หลายเดือนก่อน

      @@bugbytes3923 thank you 🙏🙏🙏

  • @carloseduardovieiramartins6102
    @carloseduardovieiramartins6102 ปีที่แล้ว

    Its possible tô make for example, a tree level form, with a product , color and sizes variants to submit ALL together and get the fk for each one?

  • @smartjoetechnologies
    @smartjoetechnologies ปีที่แล้ว

    Thanks sir

    • @bugbytes3923
      @bugbytes3923  ปีที่แล้ว

      You're welcome! Thanks for watching.

  • @shivavsk6178
    @shivavsk6178 ปีที่แล้ว

    Can you share the source code for this

    • @dglebable
      @dglebable 7 หลายเดือนก่อน

      Was there a reply to this request for code?

  • @catalinim4227
    @catalinim4227 ปีที่แล้ว

    why not use one form with multiple rows 🧐

  • @frameff9073
    @frameff9073 ปีที่แล้ว

    thank

  • @alexforget
    @alexforget 11 หลายเดือนก่อน

    that repo is all broken, the code hasn't been updated for 3 year and is no longer working with django

  • @dstrelnikov
    @dstrelnikov 8 หลายเดือนก่อน

    man you do great tutorials, but can't understand how "div" element became to be "dev" in pronunciation, same for "file" -> "fail"

    • @bugbytes3923
      @bugbytes3923  8 หลายเดือนก่อน

      Thanks! Sorry, the Scottish accent is quite particular about these things.

  • @umairsarwar7472
    @umairsarwar7472 ปีที่แล้ว