Skip to content

@maximebf /gist:3986659
Created

Embed URL

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Jinja2 macro to render WTForms fields with Twitter Bootstrap
{% 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 %}
@cloud-eagle

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

@cloud-eagle

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.

@cloud-eagle

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!

@rawrgulmuffins

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.

@cancerballs

Thanks.

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

@dasfaha

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

@vicngtor

Can you update this to the latest bootstrap3?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.