https://github.com/idlesign/django-siteajax
Reusable application for Django bridging client and server sides with htmx
Streamline you server and client interaction using declarative techniques
in your HTML and helpful abstractions from siteajax
in your views.
Note
The client side of siteajax
is powered by htmx
(the successor of intercooler.js
) - https://htmx.org/
Somewhere in your views.py
:
from django.shortcuts import redirect, render
from siteajax.toolbox import Ajax
def index_page(request):
"""Suppose this view is served at /"""
ajax: Ajax = request.ajax
if ajax:
news = ... # Here we fetch some news from DB.
# We can drive client side with the
# help of siteajax.toolbox.AjaxResponse
# but for this demo simple rendering is enough.
return render(request, 'mytemplates/sub_news.html', {'news': news})
return render(request, 'mytemplates/index.html')
Now to your mytemplates/index.html
:
<!DOCTYPE html>
<html>
<head>
<!-- Get client library js from CDN. -->
{% include "siteajax/cdn.html" %}
</head>
<body>
<div hx-get="/" hx-trigger="load"></div>
<!-- The contents of the above div will be replaced
with news from server automatically fetched on page load. -->
</body>
</html>
At last mytemplates/sub_news.html
(nothing special):
{% for item in news %}<div>{{ item.title }}</div>{% endfor %}