I have used django allauth for user registration and login. I have used the {{ form.has_errors }} in template to show an error but the error is not displayed in the template. What might be the reason for not showing an error in the template?
The code from allauth login.html(account/login.html)
{% block content %}
<div class="login-box">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-md-offset-3 login-area">
<span class="error">
{% if form.has_errors %}
<p>Your username and password didn't match. Please try again.</p>
{% endif %}
</span>
<div class="panel panel-default">
<div class="panel-heading login-header">{% trans "Sign In" %}</div>
<div class="panel-body">
<form class="login" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
<div class="form-group form-group-lg">
<label for="emailAddress">Email address</label>
<input type="email" class="form-control" id="emailAddress id_login" name="login" placeholder="Email">
</div>
<div class="form-group form-group-lg">
<label for="password">Password</label>
<input type="password" class="form-control" id="password id_password" name="password" placeholder="Password">
</div>
<div class="form-group">
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
{% endif %}
</div>
<button class="btn-block signin-btn btn-sm btn-primary pull-right m-t-n-xs" type="submit">{% trans "Sign In" %}</button>
</form>
</div>
<div class="panel-footer">
<a class="button secondaryAction" href="{% url 'account_reset_password' %}">{% trans "Forgot Password?" %}</a>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
Try this one. Errors raised by the form which is not attached to field are stored in non_field_errors
{% if form.non_field_errors %}
<ul class='form-errors'>
{% for error in form.non_field_errors %}
<li>{{ error }}</li>
{% endfor %}
</ul>
{% endif %}
or if you want to display in your way try this one
{% if form.errors %}
<p>Your username and password didn't match. Please try again.</p>
{% endif %}
Seems to be a misunderstanding of has_error
his method returns a boolean designating whether a field has an error
with a specific error code. If code is None, it will return True if
the field contains any errors at all.
Coupled with the fact that you are rendering the form manually. Generally there are two types of form errors, non field errors and errors associated with each field (when their validation fails). The above method accepts a field name as a parameter and returns true if the field has failed validation.
You have several options, including continuing with your current approach but checking for form.errors instead of form.has_error or displaying the error with each field separately.
Related
Hello I use the allauth package to validate forms. The problem I have in this case is that I want to change the default templates of the allauth package and add my own styles and css classes to them. And I have done this, but my problem is that when the user enters incomplete or incorrect login information, no validation message is displayed to the user. I want to change the default allauth templates, such as login.html, signup.html, etc. and also I want to display my own authentication messages. Please guide step by step I because am learning Django, Thanks.
This is login.html
{% extends "base.html" %}
{% load i18n %}
{% load account socialaccount %}
{% block head_title %}{% trans "Sign In" %}{% endblock %}
{% block content %}
<h1 class="head-line">{% trans "Sign In" %}</h1>
{% get_providers as socialaccount_providers %}
{% if socialaccount_providers %}
<div class="container">
<p class="text-center">{% blocktrans with site.name as site_name %}Please sign in with one
of your existing third party accounts. Or, sign up
for a {{ site_name }} account and sign in below:{% endblocktrans %}
</p>
</div>
<div class="socialaccount_ballot container">
<ul class="socialaccount_providers text-center border">
{% include "socialaccount/snippets/provider_list.html" with process="login" %}
</ul>
<div class="login-or text-center mt">{% trans 'or' %}</div>
</div>
{% include "socialaccount/snippets/login_extra.html" %}
{% else %}
<p>{% blocktrans %}If you have not created an account yet, then please
sign up first.{% endblocktrans %}</p>
{% endif %}
<div class="container">
<form class="login" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
<div class="form-group">
<label for="id_username">Username: </label>
<input type="text" class="form-control" id="id_username" name="login" placeholder="Username">
</div>
<div class="form-group">
<label for="id_password">Password: </label>
<input type="password" class="form-control" id="id_password" name="password" placeholder="Password">
</div>
{{ form.username }}
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}"/>
{% endif %}
<a class="button secondaryAction"
href="{% url 'account_reset_password' %}">{% trans "Forgot Password?" %}</a>
<button class="primaryAction btn btn-block mt mb" type="submit">{% trans "Sign In" %}</button>
</form>
</div>
{% endblock %}
This is signup.html
{% extends "account/base.html" %}
{% load i18n %}
{% block head_title %}{% trans "Signup" %}{% endblock %}
{% block content %}
<h1 class="head-line">{% trans "Sign Up" %}</h1>
<p class="text-center">{% blocktrans %}Already have an account? Then please sign in.{% endblocktrans %}
</p>
<div class="container">
<form class="signup" id="signup_form" method="post" action="{% url 'account_signup' %}">
{% csrf_token %}
<div class="form-group">
<label for="id_username">Username: </label>
<input type="text" class="form-control" id="id_username" name="login" placeholder="Username">
</div>
<div class="form-group">
<label for="id_email">Email: </label>
<input type="text" class="form-control" id="id_username" name="email" placeholder="Emial">
</div>
<div class="form-group">
<label for="id_password1">Password: </label>
<input type="password" class="form-control" id="id_username" name="password1" placeholder="Password">
</div>
<div class="form-group">
<label for="id_password2">Password Again: </label>
<input type="password" class="form-control" id="id_username" name="password2" placeholder="Password Again">
</div>
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}"/>
{% endif %}
<button type="submit" class="btn btn-block mb">{% trans "Sign Up" %} »</button>
</form>
</div>
{% endblock %}
And this is logout.html
{% extends "account/base.html" %}
{% load i18n %}
{% block head_title %}{% trans "Sign Out" %}{% endblock %}
{% block content %}
<h1 class="head-line">{% trans "Sign Out" %}</h1>
<p class="text-center">{% trans 'Are you sure you want to sign out?' %}</p>
<div class="container">
<form method="post" action="{% url 'account_logout' %}">
{% csrf_token %}
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}"/>
{% endif %}
<button type="submit" class="btn btn-block mb">{% trans 'Sign Out' %}</button>
</form>
</div>
{% endblock %}
I am creating a login page using django but it does not show any messages when I enter wrong passwords or email addresses. I've also checked other messages but it didn't help.
login.html
<div class="right">
<h2>Login</h2>
{% if messages %}
{% for message in messages %}
<div class="alert alert-{{ message.tags }}">
{{ message }}
</div>
{% endfor %}
{% endif %}
<form method="POST">
{% csrf_token %}
<fieldset class="form-group">
<div class="field">
<div class="label">Email or Username</div>
<input type="text" name="username" id="username" class="form-control">
</div>
<div class="field">
<div class="label">Password</div>
<input type="password" name="password" id="password" class="form-control">
</div>
<button class="login" type="submit">LOGIN</button>
</fieldset>
</form>
<div class="sign_up">
<small>Don’t have an account yet?</small>
<a class="signup" href="{% url 'register' %}">SIGN UP</a>
</div>
</div>
urls.py has this path for the login page(I have imported all the necessary classes):
path('login/', auth_views.LoginView.as_view(template_name='users/login.html') , name='login'),
But the messages are shown when I use this form|crispy in login.html
<div class="content-section">
<form method="POST">
{% csrf_token %}
<fieldset class="form-group">
<legend class="border-bottom mb-4">Login</legend>
{{ form|crispy }}
</fieldset>
<div class="form-group">
<button class="btn btn-outline-info" type="submit">Sign In</button>
</div>
</form>
<div class="border-top pt-3">
<small class="muted-text">
Want a new Account? <a class="ml-1" href="{% url 'register' %}">Sign Up</a>
</small>
</div>
</div>
Here you used LoginView using form it will return it will show you error because of {{ form|crispy }} template tag render form and fields along with field.errors and field.non_field_error.
That's Why you can get an error message if you remove message block in your code it will show you an error there is no connection with form and message in login view
If you want to render you HTML form with CSS you need to explicitly define errors showing block like this
<div class="right">
<h2>Login</h2>
{% if form.errors %}
{% for field in form %}
{% for error in field.errors %}
<div class="alert alert-danger">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endfor %}
{% for error in form.non_field_errors %}
<div class="alert alert-danger">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endif %}
<form method="POST">
{% csrf_token %}
<fieldset class="form-group">
<div class="field">
<div class="label">Email or Username</div>
<input type="text" name="username" id="username" class="form-control">
</div>
<div class="field">
<div class="label">Password</div>
<input type="password" name="password" id="password" class="form-control">
</div>
<button class="login" type="submit">LOGIN</button>
</fieldset>
</form>
<div class="sign_up">
<small>Don’t have an account yet?</small>
<a class="signup" href="{% url 'register' %}">SIGN UP</a>
</div>
</div>
Here not meaning to use the message framework of Django. Form it self return error in his errors attribute of a form
Hope you satisfied with this answer
How do i allow to display a particular form content after the user clicks on checkbox Yes or No
for e.g.if the user clicks on yes checkbox display the form to be filled if user clicks No display another form part to be filled
I want to add it here like in my applyonline.html
{% extends "pmmvyapp/base.html" %}
{% load crispy_forms_tags %}
{% load static %}
{% block content%}
<div class="col-md-8">
<form method="post" action="/add_aganwadi/">
{% csrf_token %}
<div class="form-group">
<div class=" mb-4">
<h6><u>Please Fill up the details below (Note that all the fields are required)</u></h6>
</div>
<legend class="border-bottom mb-4" ,align="center">Beneficiary Details</legend>
<label for="formGropuNameInput">Does Beneficiary have a Driving License Card?*</label>
<div class="form-check form-check-inline">
{% if..... %}
<input class="form-check-input" type="checkbox" id="inlineCheckbox1" value="option1">
<label class="form-check-label" for="inlineCheckbox1">Yes</label>
{% else %}
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="checkbox" id="inlineCheckbox2" value="option2">
<label class="form-check-label" for="inlineCheckbox2">No</label>
</div>
</div>
{% endif %}
<button type="submit" class="btn btn-primary" style="margin-bottom:10px ">Submit</button>
</form>
</div>
{% endblock %}
I want to know if I can use the if statement to achieve this and if so how?
if you don't have any problem in including angularjs in form page and radio button instead of check box this below sample code image i used previously will help you
Okay, so I've created a simple purchase form which makes use of some custom form fields. I've rendered a simple form to test if it works properly, and it does, as shown below.
<form id="category_form" method="post" action="/purchase/">
{% csrf_token %}
{% for hidden in form.hidden_fields %}
{{ hidden }}
{% endfor %}
{% for field in form.visible_fields %}
{{ field.errors }}
{{ field.help_text }}
{{ field }}
{% endfor %}
<input type="submit" name="submit" value="Make purchase" />
</form>
Now, I wish to style it to Bootstrap 3. I've managed to style it with no problems using the django widget tweaks package. However, when I submit the form, I get this error 'NoneType' object has no attribute 'replace' I've tried it without the widget tweaks and I still get the same error.
Any ideas why this may be the case? The original form works fine unstyled, but as soon as I style it I get the above error. Now if my understanding is correct, Django takes one field and styles corresponding fields the same, but, some of my field types are different. i.e. dropdowns and text boxes, which can't be styled the same way. I'm not sure what the best way around this is.
views.py
def checkout(request):
if request.method == 'POST':
form = PurchaseForm(request.POST)
if form.is_valid():
form.save(commit=True)
return index(request) # Change this to point to the confirmation page
else:
print (form.errors)
else:
form = PurchaseForm()
return render(request, 'ticket/checkout.html', {'form': form})
checkout.html
<form class="form-horizontal" method="post" action="/cart/checkout/">
{% csrf_token %}
<fieldset>
<!-- Form Name -->
<legend>Card Details</legend>
<!-- Select Basic -->
<div class="form-group">
<label class="col-sm-3 control-label" for="card-type">{{ form.payment_type.help_text }}</label>
<div class="col-sm-9">
{{ form.payment_type|attr:"id:card-type"|attr:"name:card-type"|attr:"class:form-control" }}
{{ form.error }}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-3 control-label" for="card-name">{{ form.card_name.help_text }}</label>
<div class="col-sm-9">
{{ form.card_name|attr:"id:card-name"|attr:"name:card-name"|attr:"type:text"|attr:"placeholder:Card Holder's Name"|attr:"class:form-control input-md"|attr:"required:"}}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-3 control-label" for="card-number">{{ form.card_number.help_text }}</label>
<div class="col-sm-9">
{{ form.card_number|attr:"id:card-number"|attr:"name:card-number"|attr:"type:text"|attr:"placeholder:Credit / Debit card number"|attr:"class:form-control input-md"|attr:"required:"}}
</div>
</div>
<!-- Select Basic -->
<div class="form-group">
<label class="col-sm-3 control-label" for="expiry-date">{{ form.expiry_date.help_text }}</label>
<div class="col-sm-4">
{{ form.expiry_date|attr:"id:expiry-date"|attr:"name:expiry-date"|attr:"class:form-control col-sm-4" }}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-3 control-label" for="cvv-number">{{ form.security_code.help_text }}</label>
<div class="col-sm-9">
{{ form.security_code|attr:"id:cvv-number"|attr:"name:cvv-number"|attr:"type:text"|attr:"placeholder:Security Code"|attr:"class:form-control input-md"|attr:"required:"}}
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label" for="date">{{ form.date.help_text }}</label>
<div class="col-sm-9">
{{ form.date|attr:"id:date"|attr:"name:date"|attr:"class:form-control input-md"|attr:"required:"}}
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label" for="Purchase"></label>
<div class="col-md-8">
<button id="Purchase" name="Purchase" class="btn btn-success">Purchase</button>
<button id="Cancel" name="Cancel" class="btn btn-inverse">Cancel</button>
</div>
</div>
</fieldset>
I would suggest using the python package django-bootstrap3 to style your forms. It can be found at https://github.com/dyve/django-bootstrap3
Hope this helps!
I am not sure whether I understand your question correctly. However I noticed that 1. there seems no tag in your form.
2. maybe you can use plain html instead of other tag( {{ form.security_code|attr:"id:cvv-number"|attr:"name:cvv-number" ****}} ), such as
3. to validate form, you may try to write something like :
{% if form.password.errors %}
{% for error in form.password.errors %} {{ error}} {% endfor %} {% endif %}
Hope you figure out this problem as soon as possible.
I am using Django Allauth for user flow in my project. I have successfully created my own set of templates which inherit from the standard Allauth templates and they work 95%. For some reason, however, I do not receive an error for an invalid login.
If I enter 'test#email' for the user I get a 'Please enter a valid email address' error but if I enter a proper email with an incorrect password it simply reloads the page but with no errors as to what went wrong. I've included my template below which has the {{ form.login.errors }} and {{ form.password.errors }} tags.
All guidance is appreciated, thank you.
Template:
<div id="search_container">
<div id="search_box_content">
{% block page_content %}
<h4>Login</h4>
<form class="" id="user-form" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
<h1> {{ form.login.errors }}</h1>
<h1> {{ form.password.errors }}</h1>
<div class="input_class">
<label for="login">Username: </label>
{{ form.login }}
</div>
<div class="input_class">
<label for="password">Password: </label>
{{ form.password }}
</div>
<div class="input_class" id="forgot_pass">
<label for="remember">
Remember Me? </label>
{{ form.remember }}
</div>
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
{% endif %}
<div id="modal_bottom_bar">
<a class="button secondaryAction" id="forgot_pass" href="{% url 'account_reset_password' %}">Forgot your Password?</a>
<button class="primaryAction" id="login_submit" type="submit">Login</button></div>
</form>
{% endblock %}
</div>
</div>
Some errors are non field errors such as those errors which are raised for some custom validation and are not included in field.errors rather they are in form.non_field_errors:
So better use this snippet to show all errors which belongs to fields and to custom validation if you are rendering your form manually:
{% if form.errors %}
{% for field in form %}
{% for error in field.errors %}
<div class="alert alert-error">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endfor %}
{% for error in form.non_field_errors %}
<div class="alert alert-error">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endif %}