Flask-WTF: Hinzufügen eines Formulars zu Ihrer Flask-Anwendung

WBOY
Freigeben: 2023-06-17 21:50:56
Original
941 Leute haben es durchsucht

Flask-WTF ist ein Python-Paket, das entwickelt wurde, um Flask-Framework-Anwendungen mithilfe von Formularen zu vereinfachen. Es bietet eine einfache, aber leistungsstarke Schnittstelle zum einfachen Hinzufügen von Formularen zu Flask-Anwendungen. Mit Flask-WTF können Sie Formulardaten einfach validieren und verarbeiten und Ihren Formularen benutzerdefinierte Validatoren und Felder hinzufügen. In diesem Artikel wird erläutert, wie Sie mit Flask-WTF ein Formular zu einer Flask-Anwendung hinzufügen.

Flask-WTF installieren

Zuerst müssen Sie das Flask-WTF-Paket installieren. Es kann mit pip installiert werden:

pip install Flask-WTF
Nach dem Login kopieren

Eine Flask-Anwendung erstellen

Bevor Sie mit dem Hinzufügen von Formularen beginnen, müssen Sie eine Flask-Anwendung erstellen. Hier ist ein Beispiel einer einfachen Flask-Anwendung:

from flask import Flask

app = Flask(__name__)

@app.route('/')
def hello():
    return 'Hello, World!'
Nach dem Login kopieren

Für komplexere Anwendungen ist möglicherweise mehr Konfiguration und Einrichtung erforderlich.

Formularklassen erstellen

Flask-WTF verwendet Formularklassen, um Formularfelder zu beschreiben. Die Formularklasse ist von der in Flask-WTF bereitgestellten Klasse FlaskForm abgeleitet. In einer Formularklasse können Sie Formularfelder, Validatoren und andere Eigenschaften definieren. Hier sind einige grundlegende Formularfeldtypen: 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')
Nach dem Login kopieren

在上面的示例中,表单类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')
Nach dem Login kopieren

在上面的示例中,定义了一个验证器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)
Nach dem Login kopieren

在上面的示例中,视图函数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>
Nach dem Login kopieren

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

  • StringField: wird zum Eingeben von Zeichenfolgen verwendet.
  • IntegerField: wird zur Eingabe von Ganzzahlen verwendet.
  • BooleanField: Wird zur Eingabe boolescher Werte (Kontrollkästchen) verwendet.
  • TextAreaField: wird zur Eingabe von mehrzeiligem Text verwendet.
  • SelectField: wird zum Auswählen von Optionen im Dropdown-Menü verwendet.
  • RadioField: wird für Optionsfelder verwendet.
  • FileField: wird zum Hochladen von Dateien verwendet.
Das Folgende ist ein einfaches Beispiel für eine Formularklasse:

rrreee

Im obigen Beispiel enthält die Formularklasse NameForm einen Namen name String-Felder und eine Senden-Schaltfläche namens submit. Zeichenfolgenfelder werden mithilfe des Typs StringField und des Validators DataRequired definiert. Der DataRequired-Validator stellt sicher, dass der Feldwert nicht leer ist.

In der Formularklasse können Sie auch benutzerdefinierte Validatoren definieren. Hier ist beispielsweise ein benutzerdefinierter Validator, der sicherstellt, dass der vom Benutzer eingegebene Wert weniger als 50 Zeichen umfasst: 🎜rrreee🎜 Im obigen Beispiel ist ein Validator LengthValidator definiert. Der Validator wird mit einem Parameter für die maximale Länge initialisiert und prüft, ob die Länge des Eingabefelds die maximale Länge überschreitet. Fügen Sie in der Zeichenfolgenfelddefinition den Validator LengthValidator zur Liste der Validatoren hinzu, um sicherzustellen, dass sein Attributwert weniger als 50 Zeichen beträgt. 🎜🎜In der Formularklasse können Sie auch andere Eigenschaften definieren, z. B. CSS-Klassen, die beim Rendern von Feldern verwendet werden sollen. Diese Eigenschaften können verwendet werden, um das Erscheinungsbild von Formularfeldern anzupassen. 🎜🎜Formulare verwenden🎜🎜Um ein Formular in einer Flask-Anwendung zu verwenden, müssen Sie eine Formularinstanz in der Ansichtsfunktion erstellen. Aus der Formularklasse kann eine Formularinstanz erstellt und an die Vorlage übergeben werden. Hier ist ein Beispiel einer Ansichtsfunktion: 🎜rrreee🎜Im obigen Beispiel erstellt die Ansichtsfunktion index die Formularinstanz form. Wenn das Formular gesendet wird und die Validierung erfolgreich ist, rufen Sie den Namen aus dem gesendeten Formular ab und übergeben Sie ihn an die Vorlage. Zeigen Sie das Formular an, wenn es nicht gesendet wurde oder die Validierung fehlgeschlagen ist. 🎜🎜In der Vorlage können Sie die von Flask-WTF bereitgestellte Formularrenderingfunktion verwenden, um das Formular zu rendern. Hier ist ein einfaches Vorlagenbeispiel unter Verwendung der Jinja2-Vorlagen-Engine und des Bootstrap-Stils: 🎜rrreee🎜Verwenden Sie in der Vorlage das form-Objekt, um die Formularfelder und die Schaltfläche „Senden“ darzustellen. Das Feld csrf_token ist ein verstecktes Feld, das zur Verhinderung von Cross-Site-Request-Forgery-Angriffen verwendet wird. 🎜🎜Zusammenfassung🎜🎜Mit Flask-WTF können Sie ganz einfach Formulare zu Ihrer Flask-Anwendung hinzufügen. Mithilfe der Formularklasse können Sie benutzerdefinierte Formularfelder und Validatoren erstellen. In der Ansichtsfunktion können Sie eine Formularinstanz erstellen und das Formular mithilfe einer Vorlagen-Engine rendern. Flask-WTF bietet außerdem weitere Funktionen wie Datei-Upload, Formularverschachtelung und Formularvorverarbeitung. Das Verständnis der Funktionen von Flask-WTF kann die Formularverarbeitung in Flask-Anwendungen einfacher und effizienter machen. 🎜

Das obige ist der detaillierte Inhalt vonFlask-WTF: Hinzufügen eines Formulars zu Ihrer Flask-Anwendung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage