MENU

Fun & Interesting

Django & HTMX - Dynamic Form Creation and Submission

BugBytes 34,053 lượt xem 1 year ago
Video Not Working? Fix It Now

In this video, we look at how to dynamically create forms using Django and HTMX, and look at how to dynamically submit these forms - both individually, and as a group.

We'll see some cool tricks here, such as:
- Using the hx-on attribute to perform actions after submission
- Using the "from" trigger modifier to trigger submission of all forms via a single button click

☕️ 𝗕𝘂𝘆 𝗺𝗲 𝗮 𝗰𝗼𝗳𝗳𝗲𝗲:
To support the channel and encourage new videos, please consider buying me a coffee here:
https://ko-fi.com/bugbytes

▶️ Full Playlist:
https://www.youtube.com/playlist?list=PL-2EBeDYMIbRByZ8GXhcnQSuv2dog4JxY

📌 𝗖𝗵𝗮𝗽𝘁𝗲𝗿𝘀:
00:00 Intro
00:43 Defining model and ModelForm
02:53 Adding Form to View and Template
07:21 Adding forms dynamically with HTMX
12:04 Submitting forms individually with HTMX
13:55 Adding contact list to template
17:36 Removing form after submission with hx-on attribute
19:13 Submitting multiple forms at once with HTMX
22:02 Adding Cancel button to clear forms

𝗦𝗼𝗰𝗶𝗮𝗹 𝗠𝗲𝗱𝗶𝗮:
📖 Blog: https://bugbytes.io/posts/
👾 Github: https://github.com/bugbytes-io/
🐦 Twitter: https://twitter.com/bugbytesio

📚 𝗙𝘂𝗿𝘁𝗵𝗲𝗿 𝗿𝗲𝗮𝗱𝗶𝗻𝗴 𝗮𝗻𝗱 𝗶𝗻𝗳𝗼𝗿𝗺𝗮𝘁𝗶𝗼𝗻:
django-htmx-todo-list (Jack Linke): https://github.com/jacklinke/django-htmx-todo-list
hx-swap: https://htmx.org/attributes/hx-swap/
hx-on: https://htmx.org/attributes/hx-on/
django-htmx CSRF tip: https://django-htmx.readthedocs.io/en/latest/tips.html

#django #python #htmx

Comment