Home > Software design >  How to hide the django AuthenticationForm built-in error_message?
How to hide the django AuthenticationForm built-in error_message?

Time:03-07

I'm new to django and trying to hide the error message that has bullet on it (see screenshot below), the built-in error_message attribute when using the AuthenticationForm class on login, because I have used the form.errors in the templates and wanted to keep the error message on the top. I tried to use css to hide, but when I load the login page, it wont work. Is there a way to hide or perhaps disable it? I can only see the options to customize error_message in the docs though.

Here is my code.

login.htmlenter image description here

{% extends 'blog/base.html' %} 
{% load crispy_forms_tags %}
{% block content %}  
<!-- Custom Error Message -->
{% if  form.errors %}
    {% for _, error in form.errors.items %}
        <div >
            {{ error|striptags }}
        </div>    
    {% endfor %}
{% endif %}
  <div >
      <form method="POST">
          {% csrf_token %}
          <fieldset >
              <legend >Log in</legend>
              {{ form | crispy }}
          </fieldset>
          <div >
              <button  type="submit">Login</button>
              <small >
                  <a href="{% url 'password_reset' %}">Forgot Password?</a>
              </small>
          </div>
      </form>
      <div >
          <small >
              Need An Account? <a href="{% url 'register' %}" >Sign Up</a>
          </small>
      </div>
  </div>
{% endblock content %}

forms.py

class LogInAuthForm(AuthenticationForm):
    username = forms.CharField(label='', widget=forms.TextInput(attrs={'style': 'margin:1rem 0 4rem', 'placeholder': 'Username'}))
    password = forms.CharField(label='', widget=forms.PasswordInput(attrs={'class': 'mb-4', 'placeholder': 'Password'}))

    error_messages = {
        'invalid_login': _("Invalid login. Note that both " "fields may be case-sensitive."),
        'inactive': _("This account is inactive."),
    }

views.py

class CustomLoginView(LoginView):
    authentication_form = LogInAuthForm


CodePudding user response:

{{form|crispy}} this creates built in template form. Try inspect element on those input tags you will see form-error class or id which creates those error messages. So, may be try this (Design as you like).

{% load crispy_forms_tags %}
{% block content %}  
<!-- Custom Error Message -->
{% if  form.errors %}
    {% for _, error in form.errors.items %}
        <div >
            {{ error|striptags }}
        </div>    
    {% endfor %}
{% endif %}
  <div >
      <form method="POST">
          {% csrf_token %}
          <fieldset >
              <legend >Log in</legend>
              <input  name="username" placeholder="Username">
             <input  name="password" placeholder="Password">
          </fieldset>
          <div >
              <button  type="submit">Login</button>
              <small >
                  <a href="{% url 'password_reset' %}">Forgot Password?</a>
              </small>
          </div>
      </form>
      <div >
          <small >
              Need An Account? <a href="{% url 'register' %}" >Sign Up</a>
          </small>
      </div>
  </div>
{% endblock content %}```

CodePudding user response:

If you do not want to display the default form with errors, you can render it manually.

So replace:

<fieldset >
    <legend >Log in</legend>
    {{ form | crispy }}
</fieldset>

with something like

<fieldset >
    <legend >Log in</legend>
    {{ form.username|as_crispy_field }}
    {{ form.password|as_crispy_field }}
</fieldset>
  • Related