Flask-WTF : Ajouter un formulaire à votre application Flask

WBOY
Libérer: 2023-06-17 21:50:56
original
944 Les gens l'ont consulté

Flask-WTF est un package Python conçu pour simplifier les applications du framework Flask à l'aide de formulaires. Il fournit une interface simple mais puissante pour ajouter facilement des formulaires aux applications Flask. En utilisant Flask-WTF, vous pouvez facilement valider et traiter les données du formulaire et ajouter des validateurs et des champs personnalisés à vos formulaires. Cet article explique comment utiliser Flask-WTF pour ajouter un formulaire à une application Flask.

Installer Flask-WTF

Tout d'abord, vous devez installer le package Flask-WTF. Il peut être installé en utilisant pip :

pip install Flask-WTF
Copier après la connexion

Création d'une application Flask

Avant de commencer à ajouter des formulaires, vous devez créer une application Flask. Voici un exemple d'application Flask simple :

from flask import Flask

app = Flask(__name__)

@app.route('/')
def hello():
    return 'Hello, World!'
Copier après la connexion

Pour des applications plus complexes, davantage de configuration et d'installation peuvent être nécessaires.

Créer des classes de formulaire

Flask-WTF utilise des classes de formulaire pour décrire les champs de formulaire. La classe form est dérivée de la classe FlaskForm fournie dans Flask-WTF. Dans une classe de formulaire, vous pouvez définir des champs de formulaire, des validateurs et d'autres propriétés. Voici quelques types de champs de formulaire de base : FlaskForm派生而来的。在表单类中,可以定义表单字段、验证器和其他属性。以下是一些基本的表单字段类型:

  • StringField:用于输入字符串。
  • IntegerField:用于输入整数。
  • BooleanField:用于输入布尔值(复选框)。
  • TextAreaField:用于输入多行文本。
  • SelectField:用于选择下拉菜单中的选项。
  • RadioField:用于单选按钮。
  • FileField:用于上传文件。

以下是一个简单的表单类示例:

from flask_wtf import FlaskForm
from wtforms import StringField, SubmitField
from wtforms.validators import DataRequired

class NameForm(FlaskForm):
    name = StringField('Name', validators=[DataRequired()])
    submit = SubmitField('Submit')
Copier après la connexion

在上面的示例中,表单类NameForm包含一个名称为name的字符串字段和一个名称为submit的提交按钮。字符串字段使用StringField类型和DataRequired验证器定义。DataRequired验证器确保字段值不为空。

在表单类中,还可以定义自定义验证器。例如,以下是一个自定义验证器,确保用户输入的值低于50个字符:

from wtforms import ValidationError

class LengthValidator(object):
    def __init__(self, max_chars):
        self.max_chars = max_chars

    def __call__(self, form, field):
        if len(field.data) > self.max_chars:
            raise ValidationError('Value must be less than {} characters'.format(self.max_chars))

class NameForm(FlaskForm):
    name = StringField('Name', validators=[DataRequired(), LengthValidator(50)])
    submit = SubmitField('Submit')
Copier après la connexion

在上面的示例中,定义了一个验证器LengthValidator。该验证器使用一个最大长度参数初始化,并检查输入字段的长度是否超过了最大长度。在字符串字段定义中,将LengthValidator验证器添加到验证器列表中,以确保其属性值低于50个字符。

在表单类中,还可以定义其他属性,例如渲染字段时使用的CSS类。这些属性可以用来自定义表单字段的外观和感觉。

使用表单

要在Flask应用程序中使用表单,需要在视图函数中创建表单实例。可以从表单类中创建表单实例,并将其传递给模板。以下是视图函数的示例:

from flask import render_template
from app import app
from forms import NameForm

@app.route('/', methods=['GET', 'POST'])
def index():
    form = NameForm()
    if form.validate_on_submit():
        name = form.name.data
        return render_template('index.html', name=name)
    return render_template('index.html', form=form)
Copier après la connexion

在上面的示例中,视图函数index创建了表单实例form。如果表单已提交,并且验证成功,则从提交表单中获取名称并将其传递给模板。如果表单尚未提交或验证失败,则显示表单。

在模板中,可以使用Flask-WTF提供的表单渲染函数来呈现表单。以下是一个简单的模板示例,使用Jinja2模板引擎和Bootstrap样式:

<!doctype html>
<html>
  <head>
    <title>Flask-WTF Example</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.3/css/bootstrap.min.css">
  </head>
  <body>
    <div class="container">
      <h1>Hello {{ name }}!</h1>
      <form method="post">
        {{ form.csrf_token }}
        {{ form.name.label }}
        {{ form.name }}
        {% for error in form.name.errors %}
          <span>{{ error }}</span>
        {% endfor %}
        {{ form.submit }}
      </form>
    </div>
  </body>
</html>
Copier après la connexion

在模板中,使用form对象渲染表单字段和提交按钮。csrf_token

  • StringField : utilisé pour saisir des chaînes.
  • IntegerField : utilisé pour saisir des entiers.
  • BooleanField : permet de saisir des valeurs booléennes (cases à cocher).
  • TextAreaField : utilisé pour saisir du texte sur plusieurs lignes.
  • SelectField : utilisé pour sélectionner les options dans le menu déroulant.
  • RadioField : utilisé pour les boutons radio.
  • FileField : utilisé pour télécharger des fichiers.
Ce qui suit est un exemple simple de classe de formulaire :

rrreee

Dans l'exemple ci-dessus, la classe de formulaire NameForm contient un nom name Champs de chaîne et un bouton de soumission nommé submit. Les champs de chaîne sont définis à l'aide du type StringField et du validateur DataRequired. Le validateur DataRequired garantit que la valeur du champ n'est pas vide.

Dans la classe form, vous pouvez également définir des validateurs personnalisés. Par exemple, voici un validateur personnalisé qui garantit que la valeur saisie par l'utilisateur est inférieure à 50 caractères : 🎜rrreee🎜 Dans l'exemple ci-dessus, un validateur LengthValidator est défini. Le validateur est initialisé avec un paramètre de longueur maximale et vérifie si la longueur du champ de saisie dépasse la longueur maximale. Dans la définition du champ de chaîne, ajoutez le validateur LengthValidator à la liste des validateurs pour vous assurer que sa valeur d'attribut est inférieure à 50 caractères. 🎜🎜Dans la classe form, vous pouvez également définir d'autres propriétés, telles que les classes CSS à utiliser lors du rendu des champs. Ces propriétés peuvent être utilisées pour personnaliser l’apparence des champs de formulaire. 🎜🎜Utilisation de formulaires🎜🎜Pour utiliser un formulaire dans une application Flask, vous devez créer une instance de formulaire dans la fonction d'affichage. Une instance de formulaire peut être créée à partir de la classe de formulaire et transmise au modèle. Voici un exemple de fonction de vue : 🎜rrreee🎜Dans l'exemple ci-dessus, la fonction de vue index crée l'instance de formulaire form. Si le formulaire est soumis et que la validation réussit, récupérez le nom du formulaire soumis et transmettez-le au modèle. Affichez le formulaire s'il n'a pas été soumis ou si la validation a échoué. 🎜🎜Dans le modèle, vous pouvez utiliser la fonction de rendu de formulaire fournie par Flask-WTF pour restituer le formulaire. Voici un exemple de modèle simple, utilisant le moteur de modèle Jinja2 et le style Bootstrap : 🎜rrreee🎜Dans le modèle, utilisez l'objet form pour afficher les champs du formulaire et le bouton de soumission. Le champ csrf_token est un champ masqué utilisé pour empêcher les attaques de falsification de requêtes intersites. 🎜🎜Résumé🎜🎜En utilisant Flask-WTF, vous pouvez facilement ajouter des formulaires à votre application Flask. À l'aide de la classe form, vous pouvez créer des champs de formulaire et des validateurs personnalisés. Dans la fonction d'affichage, vous pouvez créer une instance de formulaire et afficher le formulaire à l'aide du moteur de modèle. Flask-WTF fournit également d'autres fonctionnalités telles que le téléchargement de fichiers, l'imbrication de formulaires et le prétraitement de formulaires. Comprendre les capacités de Flask-WTF peut rendre le traitement des formulaires dans les applications Flask plus simple et plus efficace. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal