Django snippets: Custom CSS class in Form with template tag filter

Custom CSS class in Form with template tag filter

import re
from django import template


register = template.Library()
CLASS_PATTERN = re.compile(r'\bclass="[\w\d]*"')

def cssclass(value, arg):
    """
    Replace the attribute css class for Field 'value' with 'arg'.
    """
    attrs = value.field.widget.attrs
    orig = attrs['class'] if 'class' in attrs else None

    attrs['class'] = arg
    rendered = str(value)

    if orig:
        attrs['class']
    else:
        del attrs['class']

    return rendered
register.filter('cssclass', cssclass)

More like this

Custom CSS class in Form with template tag filter by fernandogrd 1 year, 7 months ago
BetterForm with fieldsets and row_attrs by carljm 4 years, 3 months ago
Honeypot Field by SmileyChris 6 years, 1 month ago
Dynamically add css-classes to formfields by Lacour 1 year, 10 months ago
Template Filter attr by marinho 5 years ago

A lot of times we need to insert a specific CSS class into a Form instance for it to be rendered in the template.

The current method is to specify the CSS class in the Python code through the form field widget. But it would be easier for the designer to be able to specify the CSS class in the template directly.

For example rather than doing this in your Python code:

'name = forms.CharField(widget=forms.TextInput(attrs={'class':'special'}))`

You can do this in your template:

{{ form.name|cssclass:"special"}}

This template filter only works with Form Field instance.

Author:: kegan
Posted:: June 23, 2009
Language:: Python
Django Version:: 1.0
Tags:: css form class
Score:: 3 (after 3 ratings)

Tools

Comments