HTMX + Django: Modern Python Web Apps, Hold the JavaScript Transcripts
Chapter: Feature 1: Click-to-edit
Lecture: Concepts review
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
Let's briefly review the concepts covered in this lesson. By adding the htmx.js script to your web page, you gain the ability to use HX attributes.
0:12
The HX attributes allow you to dynamically change the content of a page. The first attribute you saw was hxget. It points to a URL.
0:23
When the associated tag is activated, in this case the link being clicked, htmx fetches a new HTML partial from the given URL.
0:35
The hxswap attribute specifies what to do with the newly fetched content.
0:40
The outer HTML argument says to take the new content and overwrite the tag this attribute is on.
0:47
By adding the swap modifier and a time, you can even add a little pause before the work is done in case you want to time it with CSS transitions.
0:58
Instead of using HXSwap, you can also use HXTarget. The idea is similar, but this time you're specifying what tag in the document gets replaced.
1:09
HXTarget takes a CSS selector, so you can specify anything else on the page as the target for replacement.