I just started learning Django for my new Forum project, I’m trying to find it out myself but this problem has been bothering me since 2 days. I am trying to make a registration validation for my form, I am using messages.error(request, "Text") to make an error appear on screen, but it doesn’t work, and just shows nothing.
Here is a part of my HTML code:
<div class="limiter">
<div class="container-login100" style="background:black;">
<div class="wrap-login100">
<form class="login100-form validate-form" method='POST' action="{% url 'users:register' %}" >
{% csrf_token %}
<span class="login100-form-logo">
<i class="zmdi zmdi-landscape"></i>
</span>
<span class="login100-form-title p-b-34 p-t-27">
Register
</span>
<div class="wrap-input100 validate-input" data-validate = "Enter username">
<input class="input100" type="text" name="username" placeholder="Username" required>
<span class="focus-input100" data-placeholder=""></span>
</div>
<div class="wrap-input100 validate-input" data-validate="Enter password">
<input class="input100" type="password" name="pass" placeholder="Password" required>
<span class="focus-input100" data-placeholder=""></span>
</div>
<div class="wrap-input100 validate-input" data-validate="Confirm password">
<input class="input100" type="password" name="pass-confirm" placeholder="Confirm Password" required>
<span class="focus-input100" data-placeholder=""></span>
</div>
<div class="wrap-input100 validate-input" data-validate="Enter Email">
<input class="input100" type="email" name="mail" placeholder="E-Mail" required>
<span class="focus-input100" data-placeholder=""></span>
</div>
<div class="container-login100-form-btn">
<button class="login100-form-btn">
Register
</button>
</div>
<div class="text-center p-t-90">
<a class="txt1" href="login">
Already registered?
</a>
</div>
</form>
</div>
</div>
</div>
Here is my views.py register function:
def register(request):
if request.method == "POST":
username = request.POST["username"]
password = request.POST["pass"]
password_confirm = request.POST["pass-confirm"]
email = request.POST["mail"]
print("UserName : ", username)
print('Email : ', email)
print('Password : ', password)
print('Password Confirm : ', password_confirm)
if len(username) < 7:
# print works, so I know that these POST variables are successfully transmitted.
print('Username must be more than 10 char.')
messages.error( #messages.error won't show up.
request, "Username must be more than 10 char.", 'red')
return HttpResponseRedirect(reverse('users:register'))
if len(password) < 8:
print("Your password is too short")
messages.error(request, "Your password is too short.", 'red')
return HttpResponseRedirect(reverse('users:register'))
if (password != password_confirm):
print("Passwords don't match")
messages.error(request, "Passwords don't match.", 'red')
return HttpResponseRedirect(reverse('users:register'))
else:
messages.success(request, "Success! form submitted.", 'green')
return HttpResponseRedirect(reverse('users:register'))
return render(request, 'users/register.html')
Styling for messages.error:
.green{
color:green;
font-size:1.3rem;
}
.red{
color:red;
font-size:1.3rem;
}
Please tell me if I am doing this completly wrong, I am not using the POST API from Django since I don’t know how to apply my custom styling to it.
Answers:
Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.
Method 1
From django-doc, you can use simple format of rendering messages.
Try below format of rendering messages.
{% if messages %}
<ul class="messages">
{% for message in messages %}
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
{% endfor %}
</ul>
{% endif %}
Add above messages rendering format in the top of html file or anywhere you want as:
{% if messages %}
<ul class="messages">
{% for message in messages %}
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
{% endfor %}
</ul>
{% endif %}
<div class="limiter">
<div class="container-login100" style="background:black;">
<div class="wrap-login100">
<form class="login100-form validate-form" method='POST' action="{% url 'users:register' %}" >
{% csrf_token %}
<span class="login100-form-logo">
<i class="zmdi zmdi-landscape"></i>
</span>
<span class="login100-form-title p-b-34 p-t-27">
Register
</span>
<div class="wrap-input100 validate-input" data-validate = "Enter username">
<input class="input100" type="text" name="username" placeholder="Username" required>
<span class="focus-input100" data-placeholder=""></span>
</div>
<div class="wrap-input100 validate-input" data-validate="Enter password">
<input class="input100" type="password" name="pass" placeholder="Password" required>
<span class="focus-input100" data-placeholder=""></span>
</div>
<div class="wrap-input100 validate-input" data-validate="Confirm password">
<input class="input100" type="password" name="pass-confirm" placeholder="Confirm Password" required>
<span class="focus-input100" data-placeholder=""></span>
</div>
<div class="wrap-input100 validate-input" data-validate="Enter Email">
<input class="input100" type="email" name="mail" placeholder="E-Mail" required>
<span class="focus-input100" data-placeholder=""></span>
</div>
<div class="container-login100-form-btn">
<button class="login100-form-btn">
Register
</button>
</div>
<div class="text-center p-t-90">
<a class="txt1" href="login">
Already registered?
</a>
</div>
</form>
</div>
</div>
</div>
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0