Django Crispy Forms Add Div Around Submit Button

Question

Using Django Crispy Forms I would like to add a class around my submit button like this:

<div class="col-lg-offset-3 col-lg-9">
    <input type="submit" value="Log Me In" class="btn btn-default" />
</div>

This is what I have managed so far:

<input type="submit" value="Log Me In" class="btn btn-default" />

With this code:

 def __init__(self, host=None, *args, **kwargs):
        super(AuthenticationForm, self).__init__(*args, **kwargs)
        self.host = host
        self.helper = FormHelper()
        self.helper.form_class = 'form-horizontal'
        self.helper.label_class = 'col-lg-3'
        self.helper.field_class = 'col-lg-8'
        self.helper.add_input(
            Submit('submit', 'Log Me In', css_class='btn btn-default',)
        )

As you can see I'm almost there, is there a way to include the extra divs?

Answer 1

You need to lay out all your fields, if you want to control the wrappers:

from crispy_forms.helper import FormHelper
from crispy_forms.layout import Layout, Fieldset, ButtonHolder, Submit, Div


class AuthenticationForm(forms.Form):

    def __init__(self, *args, **kwargs):
        super(AuthenticationForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.form_class = 'form-horizontal'
        self.helper.label_class = 'col-lg-3'
        self.helper.field_class = 'col-lg-8'
        self.helper.layout = Layout(
            Fieldset(
               'fieldset description text',
               'username',
               'password',
            ),
            Div(
               Submit('submit', 'Log Me In', css_class='btn btn-default'),
               css_class='col-lg-offset-3 col-lg-9',
            )
        )