app.py
from flask import Flask,flash,redirect,render_template,url_for
import os
from form import LoginForm,RegisterForm
app = Flask(name)
app.secret_key = os.getenv('SECRET_KEY', 'secret string')
app.jinja_env.trim_blocks = True
app.jinja_env.lstrip_blocks = True
@app.route('/', methods=['GET', 'POST'])
def index():
return render_template('index.html')
@app.route('/basic', methods=['GET', 'POST'])
def basic():
form = LoginForm()
if form.validate_on_submit():
username = form.username.data
flash('Welcome home, %s!' % username)
return redirect(url_for('index'))
return render_template('basic.html', form=form)
@app.route('/register', methods=['GET', 'POST'])
def register():
register_form = RegisterForm()
if register_form.validate_on_submit():
username = register_form.username.data
flash('%s, you just submit the Register Form.' % username)
return redirect(url_for('index'))
return render_template('register.html', register_form=register_form)
if name == 'main':
app.run(
host='0.0.0.0',
port=8888,
debug=True
)
form.py
from flask_wtf import FlaskForm
from flask_wtf.file import FileField, FileRequired, FileAllowed
from wtforms import StringField, PasswordField, BooleanField, IntegerField,
TextAreaField, SubmitField, MultipleFileField
from wtforms.validators import DataRequired, Length, ValidationError, Email
4.2.1 basic form example
class LoginForm(FlaskForm):
username = StringField('Username', render_kw={'placeholder':'your name'},validators=[DataRequired("登录名不能为空")])
password = PasswordField('Password', validators=[DataRequired(), Length(8, 128)])
remember = BooleanField('Remember me')
submit = SubmitField('Log in')
class RegisterForm(FlaskForm):
username = StringField('Username', validators=[DataRequired(), Length(1, 20)])
email = StringField('Email', validators=[DataRequired(), Email(), Length(1, 254)])
password = PasswordField('Password', validators=[DataRequired(), Length(8, 128)])
submit = SubmitField('Register')
.flaskenv
FLASK_ENV=development
.env
SECRET_KEY='12345678'
templates/base.html
<!DOCTYPE html>
<html>
<head>
{% block head %}
{% block metas %}
<meta charset="utf-8">
{% endblock metas %}
<title>{% block title %}Form - HelloFlask{% endblock %}</title>
<link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='favicon.ico') }}">
{% block styles %}
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css' ) }}">
{% endblock styles %}
{% endblock head %}
</head>
<body>
<nav>
{% block nav %}
<ul>
<li><a href="{{ url_for('index') }}">Home</a></li>
</ul>
{% endblock %}
</nav>
<main>
{% for message in get_flashed_messages() %}
<div class="alert">
{{ message }}
</div>
{% endfor %}
{% block content %}{% endblock %}
</main>
<footer>
{% block footer %}
<small> © 2018 <a href="aaaa" title="aaaa">aaaaaaaaaaaa</a> /
<a href="aaaa" title="aaaaaa">GitHub</a> /
<a href="aaaa" title="aaaa">aaaaaaaaa</a>
</small>
{% endblock %}
</footer>
{% block scripts %}{% endblock %}
</body>
</html>
templates/basic.html
{% extends 'base.html' %}
{% block metas %}
{{ super() }}
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
{% endblock %}
{% block styles %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap.min.css') }}">
{% endblock %}
{% block nav %}{% endblock %}
{% block content %}
<div class="container">
<a href="{{ url_for('index') }}">← Return</a>
<h1 class="display-4">Bootstrap Style Form</h1>
<form method="post">
{{ form.csrf_token }}
<div class="form-group">
{{ form.username.label }}
{% if form.username.errors %}
{{ form.username(class='form-control is-invalid') }}
{% for error in form.username.errors %}
<div class="invalid-feedback">
{{ error }}
</div>
{% endfor %}
{% else %}
{{ form.username(class='form-control') }}
{% endif %}
</div>
<div class="form-group">
{{ form.password.label }}
{% if form.password.errors %}
{{ form.password(class='form-control is-invalid') }}
{% for error in form.password.errors %}
<div class="invalid-feedback">
{{ error }}
</div>
{% endfor %}
{% else %}
{{ form.password(class='form-control') }}
{% endif %}
</div>
<div class="form-check">
{{ form.remember(class='form-check-input') }}
{{ form.remember.label }}
</div>
{{ form.submit(class='btn btn-primary') }}
<a href="{{ url_for('register') }}">← register</a>
</form>
</div>
{% endblock %}
{% block footer %}{% endblock %}
templates/register.html
{% extends 'base.html' %}
{% from 'macros.html' import form_field %}
{% block metas %}
{{ super() }}
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
{% endblock %}
{% block styles %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap.min.css') }}">
{% endblock %}
{% block nav %}{% endblock %}
{% block content %}
<div class="container">
<a href="{{ url_for('index') }}">← Return</a>
<h1 class="display-4">Register Form</h1>
<form method="post">
{{ register_form.csrf_token }}
<div class="form-group">
{{ form_field(register_form.username,class='form-control') }}
</div>
<div class="form-group">
{{ form_field(register_form.email,class='form-control') }}
</div>
<div class="form-group">
{{ form_field(register_form.password,class='form-control') }}
</div>
<div class="form-group">
{{ register_form.submit(class='btn btn-primary') }}
<a href="{{ url_for('basic') }}">← sign in</a>
</div>
</form>
{% endblock %}
templates/index.html
{% extends 'base.html' %}
{% block content %}
<h1>Forms</h1>
<ul>
<li><a href="{{ url_for('html') }}">HTML Form</a></li>
<li><a href="{{ url_for('basic') }}">Basic Form</a></li>
<li><a href="{{ url_for('bootstrap') }}">Bootstrap Style Form</a></li>
<li><a href="{{ url_for('upload') }}">File Upload</a></li>
<li><a href="{{ url_for('multi_upload') }}">Multiple Files Upload</a></li>
<li><a href="{{ url_for('dropzone_upload') }}">Integrate Dropzone.js with Flask-Dropzone</a></li>
<li><a href="{{ url_for('custom_validator') }}">Custom Validator</a></li>
<li><a href="{{ url_for('two_submits') }}">Multiple Submit Buttons</a></li>
<li><a href="{{ url_for('multi_form') }}">Multiple Forms in One Page with One View</a></li>
<li><a href="{{ url_for('multi_form_multi_view') }}">Multiple Forms in One Page with Two View</a></li>
<li><a href="{{ url_for('integrate_ckeditor') }}">Integrate CKEditor with Flask-CKEditor</a></li>
</ul>
{% endblock %}
templates/macros.html
{% macro form_field(field) %}
{{ field.label }}
{{ field(**kwargs) }}
{% if field.errors -%}
{% for error in field.errors -%}
<small class="error">{{ error }}</small>
{%- endfor %}
{%- endif %}
{% endmacro %}
static文件夹
登录页的表单渲染方式改成宏
macros.html
{% macro form_field(field) %}
{{ field.label }}
{{ field(**kwargs) }}
{% if field.errors -%}
{% for error in field.errors -%}
<small class="error">{{ error }}</small>
{%- endfor %}
{%- endif %}
{% endmacro %}
页面引用
{% from 'macros.html' import form_field %}
