This repository demonstrates how to use Django's messages framework with HTMX.
This branch shows the HX-Trigger
technique, you can find the "OOB swap" technique in the oob branch.
pipenv install
pipenv run server
(No need to run migrate
since this project doesn't use the database)
Here are the two important pieces of this puzzle:
HX-Trigger
headermessages
event and shows the messages as toasts.:tv: See the tutorial on YouTube :tv:
:newspaper: Read the article on my blog :newspaper:
pip install git+https://github.com/bblanchon/django-htmx-messages-framework.git@hx-trigger
to install the packagehtmx_messages
to the INSTALLED_APPS
settinghtmx_messages.middleware.HtmxMessageMiddleware
to the MIDDLEWARE
settings{% include 'toasts.html' %}
near the end of <body>
<script src="https://github.com/bblanchon/django-htmx-messages-framework/raw/hx-trigger/{% static 'toasts.js' %}"></script>
as the last element of <body>
The files toasts.html
and toasts.js
are tailored for Bootstrap 5; you'll have to modify them to suit your needs.