Apply CSS to Django Form Wizard

Question

I´m working with the Form Wizard which is alright but right now its not really pretty.

My Views.py is based on the docs:

class ContactWizard(SessionWizardView):
form_list = [DurationForm, ContactForm2]
def done(self, form_list, **kwargs):
    return render(self.request, 'done.html', {
        'form_data': [form.cleaned_data for form in form_list],
    })

My done.html contains:

{% extends "base.html" %}
{% block content %}
<h1> Done! </h1>
{% endblock %}

My forms are defined in forms.py:

from django import forms

class DurationForm(forms.Form):
     Duration_in_secounds = forms.IntegerField()

class FrequencyForm(forms.Form):
     Frequency_in_time_interval = forms.IntegerField()

Now i wonder how the forms even render because i never load them the way i used (for example with

{{form.as_p}}

Because whatever i change in my done.html doesnt affect the forms created with the wizard i have no idea how to add css to them.

Could any of you help me get whats going on here? (sorry if the question is stupid/ already asked - its quite late here and i couldn´t find anything for the last two hours)

Answer 1

I think it doesn't matter it's a Form Wizard. You can just create a base class that you have DurationForm and ContactForm2 extend from. For example:

def __init__(self, *args, **kwargs):
    super(BaseFormClass, self).__init__(*args, **kwargs)

    # specific field
    self.fields['name'].widget.attrs['class'] = 'my_class'

    # all fields on form
    for field in self.fields:
         self.fields[field].widget.attrs['class'] = 'my_class'

Not tested.