Can't add css class to some form fieds

Question

maybe it is just a bug or well known feature, but didn't found anything with google.
Snippet from a form(RegisterForm for django-registration):

widgets = {
        'username': HiddenInput(),
        'email': EmailInput(attrs={'class': "form-control"}),
        'password1': PasswordInput(attrs={'class': "form-control"}),
        'password2': PasswordInput(attrs={'class': "form-control"}),
        'first_name': TextInput(attrs={'class': "form-control"}),
        'last_name': TextInput(attrs={'class': "form-control"}),
    }

Snippet from template:

<div class="container">
{{ form.non_field_errors }}
<form method="post">
    {% csrf_token %}
    {% for field in form %}
    {% if field.name != 'username' %}
    <div class="form-group row {% if field.errors %}has-danger{% endif %}">
        {% if field.errors %}
        <div class="form-control-feedback">{{ field.errors.as_text }}</div>
        {% endif %}
        <label for="{{ field.id_for_label }}" class="col-form-label col-xs-2">{{ field.label }}</label>
        <div class="col-sm-10">
            {{ field }}
        </div>
    </div>
    {% endif %}
    {% endfor %}
    <div class="form-group row">
        <div class="offset-sm-2 col-sm-10">
        <button type="submit" class="btn btn-primary">Register</button>
        </div>
    </div>
</form>

No rocket science at all. Passwords and email do not get the css class, but textfields! Am i missing something?

score 0 · Answer 1 · edited May 23 '17 at 12:19

0

You are missing information it looks like when defining your widgets. Pleases see the answer provided here:

CSS styling in Django forms

edited May 23 '17 at 12:19

Community

1
1

answered Oct 04 '16 at 20:48

Zorpho

182
1
14

IMO i've done the same thing as in the linked answer. Can you please specify which details i'm missing? – Stefan Weiss Oct 05 '16 at 06:45
Does adding forms to your input help? Example: 'last_name': forms.TextInput(attrs={'class': "form-control"}), – Zorpho Oct 05 '16 at 13:35
the 1.snippet works well for first_name and last_name fields, but not for email or password. so its not an import problem. also please read my own answer – Stefan Weiss Oct 05 '16 at 14:53

score 0 · Answer 2 · answered Oct 05 '16 at 06:55

After futher testing it seems like a bug with django-registration. Not all fields get attributes via widget specification. As workaround i added css class via templatetags.

I don't know its correct, so i will not mark this as accepted answer. But it helped me.

Can't add css class to some form fieds

2 Answers2