How to render Django forms.ChoiceField as Twitter Bootstrap dropdown

Question

What is the most efficient way (in terms of programming/maintenance effort, elegance) to render a Django forms.ChoiceField as a Twitter Bootstrap dropdown using one of the django-bootstrap, django-bootstrap-form, django-bootstrap-toolkit, django-crispy-forms, etc apps? Is there explicit support for this use case in any of these apps?

Answer 1

Disclaimer I'm the lead developer of <a href="https://github.com/maraujop/django-crispy-forms/"django-crispy-forms (one of the apps mentioned).

I will try to explain how you do this with django-crispy-forms. You simply do in your template:

{% load crispy_forms_tags %}
{{ form|crispy }}

You can see this and more in django-crispy-forms docs. Your ChoiceField will be rendered as Bootstrap dropdown as you want.

Compared to django-bootstrap

First, a little bit of history. django-bootstrap was born after django-uni-form (the parent project from which django-crispy-forms evolved). At that time, django-uni-form was already doing Boostrap forms, but probably not in the best possible way (Bootstrap was supported by using an aditional contrib application). Thus, the author of django-bootstrap probably decided to go on its own.

Now, regarding Bootstrap support. django-bootstrap can also render forms but, instead of using a Django filter, it changes the base class of your form. So django-crispy-forms affects your templates while django-bootstrap affects your Python code.

Also, both django-crispy-forms and django-bootstrap let you do layouts. In django-bootstrap, layouts are in a Meta class within the form while in django-crispy-forms the layouts live in a subclass of FormHelper, which gives you decoupling.

django-bootstrap uses a tuple for defining a layout, while crispy-forms uses a subclass of Layout. This adds the possibility to reuse layouts, compose layouts easily, etc. Note that although crispy's encapsulation still has a list of fields inside, it adds a helpful and human-friendly API to programmatically manipulate the layout and I think enforces a good decoupling pattern.

From what I can see, layouts in crispy-forms are more powerful. It has a larger layout object collection, for example, prepended text, appended text, daterange and others are already supported while in django-boostrap these are in the TODO list.

crispy-forms has also an API for modifying layouts on the go and doing some hardcore programmatic layout building which is very nice.

crispy-forms also supports formsets of all kinds. It supports different CSS template packs, which means that if in the future the new kicking CSS pack is named 'chocolate', it will be very easy to create a new template pack for it and all your forms will be able to be rendered with 'chocolate' without code changes, just a simple setting variable.

crispy-forms also has attributes you can set in FormHelper that define nice extra functionaly you can easily turn on and off. You can also create your own custom attributes if you want.

Finally, django-crispy-forms (together with django-uni-form) has more than 67.000 downloads, which is quite good for a Django application. The project has almost 500 followers in Github, several big users, good testing coverage and several years of history and it's still actively maintained.

Compared to django-bootstrap-form

From what I can see django-bootstrap-form is only a filter for rendering a form with Bootstrap. That is something django-crispy-form covers while offering much, much more. The project was released on 21st August 2012 and looks to me like it's reinventing the wheel because several other apps cover already this use case.

Compared to django-bootstrap-toolkit

It's inspired by django-boostrap-form. From what I see in the docs, it also gives you a filter for rendering a form with Bootstrap. It apparently covers more Bootstrap stuff than forms, but I can't find more info in its docs. Last commit was 2 months ago.

---

I will insist that I'm obviously not the right person for a comparison that is not biased. That's why I've never written about this before. I could have published a blog post about this several times but I always dismissed the idea. However, as the fragmentation of form apps (and bootstrap-support apps) is growing, I thought this might be a good time to write down what I think.