CODEWITHSUNDEEP
djangodjango-formsdjango-templates
Penocky
Penocky

Reputation: 45

Style Django form error message

I'm trying to make django form defa error red and bold. For example, make "This field is required" red and bold. I saw error_css_class = 'error' but it's not working. https://docs.djangoproject.com/en/1.5//ref/forms/api/#django.forms.Form.error_css_class Thank you! This is my models.py

class RegiForm(forms.Form):
    error_css_class = 'error'
    DateInput = partial(forms.DateInput, {'class': 'datepicker'})
    email = forms.EmailField(max_length=75)
    first_name = forms.CharField(max_length=25)
    last_name = forms.CharField(max_length=25)
    address = forms.CharField(max_length=200)

This is my template:

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>RegistrationForm</title>
    </head>
    <body>
        <h1>Registration Form</h1>
        <form action="/login/regi/" method="POST">
            {% csrf_token %}
            {{ form.as_p }}
            <input type="submit" value="Submit" />
        </form>
    </body>
</html>

Upvotes: 3

Views: 16243

Answers (4)

Ratna Halder
Ratna Halder

Reputation: 2004

Just add this CSS to change error message color:

.errorlist {
    color: red;
}

or if you want to change field border color then

.error input, .error select {
    border: 2px red solid;
}

Upvotes: 11

AtharvaCM
AtharvaCM

Reputation: 106

I know this is an old question but I needed it as a beginner.

You can extend the ErrorList class in the

django.forms.utils

to style it as you wish. In my case I wanted it as divs and Bootstrap alerts.

So I did this in forms.py

class DivErrorList(ErrorList):
    def __str__(self):
        return self.as_divs()

    def as_divs(self):
        if not self:
            return ''
        return '<div class="errorlist">%s</div>' % ''.join(['<div class="error alert alert-danger mt-1">%s</div>' % e for e in self])

and in the views.py

form = AddToCartForm(error_class=DivErrorList)

see the documentaion: customizing-the-error-list-format

Upvotes: 8

JaceOn Ogskun
JaceOn Ogskun

Reputation: 59

To change the style of the error_message:

1st: Inspect the element of the error_message then copy its class

2nd: Add the style you want ...

In my case.... the class of the error_message is help-block

<style>
.help-block{color:red;
            font-weight:bold;
}
</style>

JUST DON'T FORGET TO PUT IT INSIDE YOUR {% block content %} or {% block body %} on your html if you extended the base.html or else... it wont work

3rd: That's All :)

Upvotes: 5

adrien
adrien

Reputation: 146

Check the class name in the source code browser. You can try to change the class name like that:

class MyForm(forms.Form):
    error_css_class = "error"

Upvotes: 6

Related Questions