search

django-crispy-forms / crispy-bootstrap5

Bootstrap5 template pack for django-crispy-forms
MIT License
462 stars 76 forks source link

Horizontal Forms bootstrap 5 not working #170

Closed marc-gist closed 8 months ago

marc-gist commented 8 months ago

I can not for the life of me figure out how to get crispy forms to render forms in this manner for bootstrap 5.

https://getbootstrap.com/docs/5.0/forms/layout/#horizontal-form-label-sizing

How do we do this? [edit] i do see in the code that i still need to set 'form-horizontal' which have done, but doesn't work.

Thank you!

aodin commented 8 months ago

You also need to set your label and field classes, such as:

from crispy_forms.helper import FormHelper

class ExampleForm(forms.Form):
    name = forms.CharField()

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.helper = FormHelper(self)
        self.helper.form_class = "form-horizontal"
        self.helper.label_class = "col-md-3"
        self.helper.field_class = "col-md-9"
marc-gist commented 8 months ago

That did it... did i miss something in the docs? sorry if so!

smithdc1 commented 8 months ago

Glad you found a solution.

I saw this in the doc, if you think it could be improved I'd appreciate thoughts!

https://django-crispy-forms.readthedocs.io/en/latest/crispy_tag_forms.html#bootstrap-horizontal-forms

marc-gist commented 8 months ago

Glad you found a solution.

I saw this in the doc, if you think it could be improved I'd appreciate thoughts!

https://django-crispy-forms.readthedocs.io/en/latest/crispy_tag_forms.html#bootstrap-horizontal-forms

Thanks, I see where I got confused, as those doc's reference Bootstrap3: 'The way you do horizontal forms in Bootstrap version 3 is setting some col-lg-X classes in labels'