public
Last active

Jinja2 macro to render WTForms fields with Twitter Bootstrap

  • Download Gist
gistfile1.py
Python
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39
{% macro form_field(field) -%}
{% set with_label = kwargs.pop('with_label', False) %}
{% set placeholder = '' %}
{% if not with_label %}
{% set placeholder = field.label.text %}
{% endif %}
<div class="control-group {% if field.errors %}error{% endif %}">
{% if with_label %}
<label for="{{ field.id }}" class="control-label">
{{ field.label.text }}{% if field.flags.required %} *{% endif %}:
</label>
{% endif %}
<div class="controls">
{% set class_ = kwargs.pop('class_', '') %}
{% if field.flags.required %}
{% set class_ = class_ + ' required' %}
{% endif %}
{% if field.type == 'BooleanField' %}
<label class="checkbox">
{{ field(class_=class_, **kwargs) }}
{{ field.label.text|safe }}
</label>
{% else %}
{% if field.type in ('TextField', 'TextAreaField', 'PasswordField') %}
{% set class_ = class_ + ' input-xlarge' %}
{% elif field.type == 'FileField' %}
{% set class_ = class_ + ' input-file' %}
{% endif %}
{{ field(class_=class_, placeholder=placeholder, **kwargs) }}
{% endif %}
{% if field.errors %}
<span class="error help-inline">{{ field.errors|join(', ') }}</span>
{% endif %}
{% if field.description %}
<p class="help-block">{{ field.description|safe }}</p>
{% endif %}
</div>
</div>
{%- endmacro %}

Thank you very much. I think your macro is the best among others! It is so automaticly and updated newest TwitterBoostrap style. ^_^ Awesome!

I have a question. In this macro there is this line: {{ field(class_=class_, **kwargs) }}
I wonder where the is field() macro. I think it is not provided here. Please provide it. And can you explain me the **kwargs what it mean and how to use it. Thank you very much.

Now I understand that I am wrong about field() macro. No need to provide that macro. But I have not understand the **kwargs.Thank you for great code!

This has been very helpful for me. Thank you very much.

I forked and added an if statement to this macro. If you're using a select field then this macro will put a placehold attribute on that select field which is invalid html. I just added an if statement to check for select fields.

Thanks.

I created a fork that renders the field properly with bootstrap 3.0.0

How do I use this macro, where do I add this code?

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.