I have a UserCreationForm which I want the first_name and last_name to be side by side, When I try the whole fields are side to side, I want the other fields to have their own line.
form.html:
{% csrf_token %}
{% for field in form %}
<p>
{% if field.help_text %}
<small style="color: grey">{{ field.help_text }}</small>
{% endif %}
{{ field.label_tag }}
{{ field }}
{% for error in field.errors %}
<p style="color: red">{{ error }}</p>
{% endfor %}
</p>
{% endfor %}
forms.py:
class AccountCreationForm(UserCreationForm):
class Meta:
model = Account
fields = ('first_name','last_name', 'email')
Since you are surrounding each field with a <p> tag, they all go into a separate line each. You can render your fields individually to style them as you like. Also check out this article for some examples.
I wrote a quick snippet for your exact case. Note that I render the fields individually and have both name fields in the same <p> (Paragraph) tag.
<p>
{% if form.first_name.help_text %}
<small style="color: grey">{{ form.first_name.help_text }}</small>
{% endif %}
{{ form.first_name.label_tag }}
{{ form.first_name }}
{% for error in form.first_name.errors %}
<span style="color: red">{{ error }}</span>
{% endfor %}
{% if form.last_name.help_text %}
<small style="color: grey">{{ form.last_name.help_text }}</small>
{% endif %}
{{ form.last_name.label_tag }}
{{ form.last_name }}
{% for error in form.last_name.errors %}
<span style="color: red">{{ error }}</span>
{% endfor %}
</p>
<p>
{% if form.email.help_text %}
<small style="color: grey">{{ form.email.help_text }}</small>
{% endif %}
{{ form.email.label_tag }}
{{ form.email }}
{% for error in form.email.errors %}
<span style="color: red">{{ error }}</span>
{% endfor %}
</p>
Related
Im trying to raise error for empty fields or fields which are not validating in form
so Im doing this method below but I know this is not the best way...
views.py :
'KnowledgeForm': form,
'errors': str(form.errors),
but then in Django-template I have to use if for each field and im adding custom name for each field , i dont know why i cant use Verbose_name...
Template :
{% if errors %}
<div class="alert alert-danger">
<p>
{% if KnowledgeForm.errors.KnowledgeTitle %}
عنوان دانش: {{ KnowledgeForm.errors.KnowledgeTitle }}
{% endif %}
{% if KnowledgeForm.errors.KnowledgeTextSummary %}
Summary: {{ KnowledgeForm.errors.KnowledgeTextSummary }}
{% endif %}
{% if KnowledgeForm.errors.KnowledgeFromDate %}
from Date: {{ KnowledgeForm.errors.KnowledgeFromDate }}
{% endif %}
{% if KnowledgeForm.errors.KnowledgetoDate %}
To date : {{ KnowledgeForm.errors.KnowledgetoDate }}
{% endif %}
{% if KnowledgeForm.errors.KnowledgeProcess %}
Chart: {{ KnowledgeForm.errors.KnowledgeProcess }}
{% endif %}
{% endif %}
</p>
</div>
{% endif %}
Second method :
{% if KnowledgeForm.errors %}
<ul class="alert alert-danger">
{% for key,value in KnowledgeForm.errors.items %}
<li>{{ key|escape }} : {{ value|escape }}</li>
{% endfor %}
</ul>
{% endif %}
in this method i get the name based on whats used in models.py how can i change it?
The most clear and concise way is to use a forloop
Try replacing your entire if block in your HTML with the below code
{% for field in KnowledgeForm %}
{% if field.errors %}
<div class="alert alert-danger">
{{ field.label_tag }} {{ field.errors }}
</div>
{% endf %}
{% endfor %}
I don't think you need 'errors': str(form.errors),
It is because you convert errors to str and you don't need to separate this.
In your template:
# if you want to use verbose_name just use label_tag.
# label_tag is equal to your verbose name.
{% for field in KnowledgeForm %}
<div class="fieldWrapper">
{{ field.errors }}
{{ field.label_tag }} {{ field }}
</div>
{% endfor %}
So you have the error top of input
The form does not show any errors when i try to submit it, it just reload the sign up page even though there are errors in my input, i used an if statement to see there are errors and the for loop to display each error but they do not seem to be working. what am i doing wrong and how can i solve it?
main.py
from flask import Flask, render_template, request
from flask_wtf import FlaskForm
from wtforms.fields import StringField, EmailField, PasswordField, SubmitField, TextAreaField, BooleanField
from wtforms.validators import Length, DataRequired, Email, EqualTo, Optional
class SignUp(FlaskForm):
username = StringField(label="username", validators=[Length(min=5, max=20), DataRequired(message="enter a name")])
first_name = StringField(label="first name", validators=[Length(min=5, max=20), DataRequired()])
last_name = StringField(label="last name", validators=[Length(min=5, max=20), DataRequired()])
email = EmailField(label="email", validators=[DataRequired(), Length(min=6)])
password = PasswordField(label="password", validators=[Length(min=8, max=40), DataRequired()])
confirm_password = PasswordField(label="confirm password", validators=[EqualTo(password), DataRequired()])
message = TextAreaField(label="message", validators=[Length(min=10, max=120), Optional()])
agree = BooleanField(label="I agree to the terms and conditions")
submit = SubmitField(label="Sign Up")
app = Flask(__name__)
app.config["SECRET_KEY"] = "uhr78hv98n4n8y7b6em98x8794c87x3m98xtmmsce9n8ce"
#app.route("/")
#app.route("/home")
def home():
return render_template("index.html")
#app.route("/signup", methods=["POST", "GET"])
#app.route("/register", methods=["POST", "GET"])
def sign_up():
form = SignUp()
if request.method == "POST":
if form.validate_on_submit():
pass
return render_template("signup.html", form=form)
if __name__ == "__main__":
app.run(debug=True)
signup.html
{% extends "base.html" %} {% block head %}
<title>Sign UP</title>
{% endblock head %} {% block body %}
<h1>Sign Up</h1>
<form method="POST" action="{{ url_for('sign_up') }}" novalidate>
{{ form.csrf_token }}
<div class="field">
{{ form.username.label }} {{ form.username }} {% if form.username.errors %}
{% for error in form.username.error %}
<p style="color: red">{{ error }}</p>
{% endfor %} {% endif %}
</div>
<div class="field">
{{ form.first_name.label }} {{ form.first_name }} {% if
form.first_name.errors %} {% for error in form.first_name.error %}
<p style="color: red">{{ error }}</p>
{% endfor %} {% endif %}
</div>
<div class="field">
{{ form.last_name.label }} {{ form.last_name }} {% if form.last_name.errors
%} {% for error in form.last_name.error %}
<p style="color: red">{{ error }}</p>
{% endfor %} {% endif %}
</div>
<div class="field">
{{ form.email.label }} {{ form.email }} {% if form.email.errors %} {% for
error in form.email.error %}
<p style="color: red">{{ error }}</p>
{% endfor %} {% endif %}
</div>
<div class="field">
{{ form.password.label }} {{ form.password }} {% if form.password.errors %}
{% for error in form.password.error %}
<p style="color: red">{{ error }}</p>
{% endfor %} {% endif %}
</div>
<div class="field">
{{ form.confirm_password.label }} {{ form.confirm_password }} {% if
form.confirm_password.errors %} {% for error in form.confirm_password.error
%}
<p style="color: red">{{ error }}</p>
{% endfor %} {% endif %}
</div>
<div class="field">
{{ form.message.label }} {{ form.message }} {% if form.message.errors %} {%
for error in form.message.error %}
<p style="color: red">{{ error }}</p>
{% endfor %} {% endif %}
</div>
{{ form.agree }} <br />
{{ form.submit }}
</form>
{% endblock body %}
when Making django board, I met the problem.
django version is 3.
I wanted form like this. but my code can't alert me "This field is required"
But widget tweaks form-control wasn't working.
which part is problem?
My code is like this
{% extends 'base.html' %}
{% load widget_tweaks %}
{% block title %}Start a New Topic{% endblock %}
{% block breadcrumb %}
<li class="breadcrumb-item">Boards</li>
<li class="breadcrumb-item">{{ board.name }}</li>
<li class="breadcrumb-item active">New topic</li>
{% endblock %}
{% block content %}
<form method="post" novalidate>
{% csrf_token %}
{% for field in form %}
<div class="form-group">
{{ field.label_tag }}
{% if form.is_bound %}
{% if field.errors %}
{% render_field field class="form-control is-invalid" %}
{% for error in field.errors %}
<div class="invalid-feedback">
{{ error }}
</div>
{% endfor %}
{% else %}
{% render_field field class="form-control is-valid" %}
{% endif %}
{% else %}
{% render_field field class="form-control" %}
{% endif %}
{% if field.help_text %}
<small class="form-text text-muted">
{{ field.help_text }}
</small>
{% endif %}
</div>
{% endfor %}
<button type="submit" class="btn btn-success">Post</button>
</form>
{% endblock %}
Try using bootstrap or django crispy forms in your form.
just change your code to blow with proper indent
{% load widget_tweaks %}
{% block title %}Start a New Topic{% endblock %}
{% block breadcrumb %}
<li class="breadcrumb-item">Boards</li>
<li class="breadcrumb-item">{{ board.name }}</li>
<li class="breadcrumb-item active">New topic</li>
{% endblock %}
{% block content %}
<form method="post" novalidate>
{% csrf_token %}
{% for field in form %}
<div class="form-group">
{{ field.label_tag }}
{% if form.is_bound %}
{% if field.errors %}
{% render_field field class="form-control is-invalid" %}
{% for error in field.errors %}
<div class="invalid-feedback">
{{ error }}
</div>
{% endfor %}
{% else %}
{% render_field field class="form-control is-valid" %}
{% endif %}
{% else %}
{% render_field field class="form-control" %}
{% endif %}
{% if field.help_text %}
<small class="form-text text-muted">
{{ field.help_text }}
</small>
{% endif %}
</div>
{% endfor %}
<button type="submit" class="btn btn-success">Post</button>
</form>
{% endblock %}```
I'm using CKEditor with Django and when i need show some RTF code in my template, usually, I use the safe built in filter (autoscape).
Example:
<p class="card-text">{{ questao.enunciado|safe }}</p>
But, how to use safe built-in inside a for loop?
{% for field in form %}
<div class="fieldWrapper">
<strong>{{ field.label_tag }}</strong>
{{ field|safe }}
{% if field.help_text %}
<p class="help">{{ field.help_text }}</p>
{% endif %}
</div>
{% endfor %}
This way above is not working for me, and in the template it ends up showing me HTML codes in text format.
You need not use the safe for the field.
Try:
{% for field in form %}
<div class="fieldWrapper">
{{ field.errors }}
{{ field.label_tag }} {{ field }}
{% if field.help_text %}
<p class="help">{{ field.help_text|safe }}</p>
{% endif %}
</div>
{% endfor %}
Also refer django documentation
You are applying safe filter to the wrong value. You have to apply it to field.label or field.help_text instead, e.g.:
{% for field in form %}
<div class="fieldWrapper">
{{ field.errors }}
<label for="{{ field.id_for_label }}">{{ field.label|safe }}</label>
{{ field }}
{% if field.help_text %}
<p class="help">{{ field.help_text|safe }}</p>
{% endif %}
</div>
{% endfor %}
I would like to iterate over form's fields in a template and display fields with errors like this:
{{ form.hidden_tag() }}
{% for field in form if field.widget.input_type != 'hidden' %}
{% if form.errors.field %}
<div class="has-error"> {{ field.label }} {{ field(size=80, class_='form-control') }}</div>
<span style="color: red;">{{ form.errors.field.0 }}</span>
{% else %}
{{ field.label }} {{ field(size=80, class_='form-control') }}
{% endif %}
{% endfor %}
But that doesn't work for some reason- the form renders but the errors are not displayed.
I've already checked solutions here, and here, and also here and none of those have helped.
Could someone please advise how to fix my form to correctly render the errors?
The issue is in using form.errors.field. This would only be accurate in jinja if you had a field named field and not for any other names.
Fortunately, you're already iterating fields, and every field has a .errors property so the shortest solution is to simply use that property
Your code should look something like:
{{ form.hidden_tag() }}
{% for field in form if field.widget.input_type != 'hidden' %}
{% if field.errors %}
<div class="has-error"> {{ field.label }} {{ field(size=80, class_='form-control') }}</div>
<span style="color: red;">{% for error in field.errors %}{{ error }}{% if not loop.last %}<br />{% endif %}{% endfor %}</span>
{% else %}
{{ field.label }} {{ field(size=80, class_='form-control') }}
{% endif %}
{% endfor %}