UI Samples

Horizontal form via helper attribute

A form rendered in horizontal layout by setting the form_class attribute on the crispy form helper.

Rendered with

{% load crispy_forms_tags %}

{% crispy form %}

The layout is forced to horizontal by setting the *_class attributes in the form helper (class or instance):

class HorizontalForm(forms.Form):
    date = forms.DateField(widget=TextInput(attrs={"type": "date"}))
    ...
    def __init__(self, *args: Any, **kwargs: Any):
        super().__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.form_class = "form-horizontal"
        self.helper.label_class = "col-lg-2"
        self.helper.field_class = "col-lg-8"
        self.helper.add_input(Submit("submit", "Submit"))