Specifying CSS classes for forms and form fields

[jwoithe]

Django-formset version: 0.13.4.
Bootstrap version: 5.2.3.

Based on chapter 11 of the documentation ("Form Renderers"), it should be possible to add CSS classes to forms and fields of simple forms using this in views.py:

from django.shortcuts import render
from django.forms import forms, fields
from formset.renderers.bootstrap import FormRenderer
from formset.views import FormView

class TestForm(forms.Form):
    default_renderer = FormRenderer(
                           form_css_classes='row',
                           field_css_classes={'foo': 'row col-3',},
                       )
    foo = fields.CharField(label="Foo", max_length=32)

class TestFormView(FormView):
    template_name = "testform.html"
    form_class = TestForm
    success_url = "/"

The testform.html template is simply this:

{% extends "main/header.html" %}
{% load formsetify %}

<django-formset endpoint="{{ request.path }}" csrf-token="{{ csrf_token }}">
    {% render_form form "bootstrap" %}
</jango-formset>

The header.html sees to the loading of the bootstrap files as needed. With this in place, the rendered output does not include any of the CSS classes associated with the renderer. If I replace the render_form line in the template with

{% render_form form "bootstrap" field_classes="row col-3" %}

the specified classes do make it into the rendered HTML and therefore take effect.

I have obviously missed something about the way FormRenderer's field_css_classes option works. Can someone point out what I've overlooked?

I first observed the problem with a form subclassed from ModelForm. The above forms.Form example turns out to do the same thing, so I've used that as the test case as it's simpler.

[jrief]

you should add formset.utils.FormMixin to your class TestForm. If doing so, there is no need to use the form_renderer in the template. You then can just write {{ form }}.

Sorry, if that's not clear from reading the docs.

[jwoithe]

Thanks for the quick response. I tried this suggestion and can confirm that it works as expected for forms subclassed from both forms.Form and ModelForm.

For what it's worth, the use of FormMixin isn't shown in the code in Chapter 11 of the documentation. The AddressForm class in section 11.1 is defined simply as class AddressForm(forms.Form). FormMixin might be mentioned elsewhere though - I haven't done an exhaustive check.

[jrief]

Thanks for reporting. I missed that one.