We Django users know well how to create a full-featured editor from a given data structure and without the need of cumbersome HTML coding. This workflow probably is one of the main factors for its success. With the Django-Admin it in fact became so easy to create editors, that out of laziness, they nowadays are used ubiquesly. A prominent proponent adopting this antipattern is Django-CMS.

On the other side, features currently offered by Django often are not suitable to create frontend-centric web-applications with a contemporary user interface. This is where Single Page Applications kick in, written in one of the many modern JavaScript frameworks. This may relegate Django to a pure data store, shifting the business logic of an application towards the browser. With the advent of HTMX it seems that this trend is reverting again, since a high level of interactivity can be achieved without going the SPA path.

One of the main hurdles remaining is the interactive handling of forms. Remember, that since Django was first released, a lot has changed in HTML 5 and JavaScript. Django however, still relies on a pure HTTP request/response-cycles for form validation and submission. This is where Django can not compete with the usability of JavaScript frameworks, since most of them make heavy usage of the built-in form data processing and validation functions.

In this talk I will show how to achieve a user experience equal to that of many contemporary Single Page Applications, but without having to introduce external frameworks and their mindset. This works by using a special webcomponent wrapping one or more Django forms, and letting it handle all the validation, feedback and submission.

Compared to other solutions, for a developer this approach is almost unintrusive since it is possible to reuse all existing Django Form- and ModelForm classes without any modification. Only the Django Form Views have to be slightly adopted. This proposed solution can handle all input fields and their corresponding widgets, which Django currently offers (except geospacials). With this tool, a developer can create the detail view for a Django model with the same ease, as doing the same task using the Django-Admin. In addition, the counterpart of the StackedInline class can be nested up to an infinite number of levels. It even is possible to create full editable list views for a model.

Thanks to the form field renderer introduced in Django 4.0, the proposed solution works with any of the major CSS frameworks, such as Bootstrap, Bulma, Foundation, Tailwind, UIKit or even your own implementation. This therefore could become a real game changer on how we handle forms with a way better User eXperience.