当前位置: 首页 > news >正文

flask web学习之表单(一)

文章目录

      • 一、使用Flask-WTF处理表单
        • 1.1 安装Flask-WTF库
        • 1.2 定义WTForms表单类
          • 常用的WTForm字段
          • 实例化字段类常用参数
          • 常用的WTForm验证器
        • 1.3 输出HTML代码
          • 使用render_kw属性
          • 在调用字段时传入
        • 1.4 在模板中渲染表单

在web程序中,表单是用户交互最常见的方式之一。用户注册、登陆、撰写文章、编辑设置无一不用到表单。

一、使用Flask-WTF处理表单

1.1 安装Flask-WTF库
pipenv install flask-wtf
pip install flask-wtf

flask-wtf默认为每个表单开启CSRF保护,它会为我们自动生成和验证CSRF令牌。所以我们应该设置:

app.secret_key = 'dadesjdajdhadheuisdjakj'
1.2 定义WTForms表单类
from wtforms import Form, StringField, IntegerField, validatorsclass MyForm(Form):name = StringField('name', [validators.Length(min=4, max=25)])age = IntegerField('Age', [validators.NumberRange(min=0, max=100)])

在这个例子中,我们使用了StringField和IntegerField来分别定义了name和age两个字段。每个字段都有一个标签(即’Name’和’Age’),以及一些验证器(validators)来验证用户提交的数据是否符合要求。例如,validators.Length(min=4, max=25)表示name字段的长度必须在4到25个字符之间,而validators.NumberRange(min=0, max=100)表示age字段的值必须在0到100之间。

常用的WTForm字段
字段类说明对应的html表示
StringField(文本字段)用于接收文本输入<input type="text">
PasswordField(密码字段)用于接收密码输入<input type="password">
TextAreaField(多行文本字段)用于接收多行文本输入<textarea></textarea>
IntegerField(整数字段)用于接收整数输入<input type="number">
BooleanField(布尔字段用于接收布尔值输入<input type="checkbox">
SelectField(下拉选择字段)用于从预定义选项中选择一个值。<select><option>...</option></select>
RadioField(单选按钮字段)用于从预定义选项中选择一个值。<input type="radio">
FileField(文件上传字段)用于上传文件。<input type="file">
实例化字段类常用参数
参数说明
label字段的标签(Label)或名称(Name),用于在表单中标识该字段。
validators包含一个或多个验证器对象的列表,用于验证输入数据是否符合指定规则。
default字段的默认值。
description字段的描述信息,通常用于在页面上显示字段的说明文本。
render_kw包含一些HTML属性和值的字典,用于向字段的HTML表示中添加额外的属性和样式。
choices可选的预定义选项列表,用于下拉选择字段和单选按钮字段。
coerce指定将输入值转换为另一种类型的函数,例如将字符串转换为整数。
filters包含一个或多个过滤器对象的列表,用于在表单提交前对输入数据进行处理。
常用的WTForm验证器
验证器说明
DataRequired验证字段必须包含数据。
Length验证输入数据的长度是否在指定范围内。
Email验证输入数据是否为有效的电子邮件地址。
EqualTo验证两个字段的值是否相等。
NumberRange验证输入数据是否在指定的数字范围内。
Regexp使用正则表达式验证输入数据是否符合指定模式。
name = StringField('Your name', validators=[DataRequired(message=u'名字不能为空')])

当使用flask-wtf定义表单时,我们仍然使用WTForm提供的字段类和验证器,创建的形式也一样,只是表单类要继承flask-wtf提供的FlaskForm类。

from flask_wtf import FlaskForm
from wtforms import StringField, IntegerField, validatorsclass MyForm(FlaskForm):name = StringField('name', [validators.Length(min=4, max=25)])age = IntegerField('Age', [validators.NumberRange(min=0, max=100)])
1.3 输出HTML代码

默认情况下,WTForm输出的字段HTML代码只包含id和name属性,属性值均为表单类中对应的字段属性名称。如果要添加额外的属性,通常有两种方法:

使用render_kw属性
username = StringField('Username', render_kw={'placeholder': '请输入你的账号'})
在调用字段时传入
form.username(style='width;200px;', class_='bar')

class 是python的保留关键字,在这里我们使用class_来代替class,渲染后会得到正确的class属性。

1.4 在模板中渲染表单
<form method="POST" action="{{ url_for('submit_form') }}">{{ form.hidden_tag() }}<div class="form-group">{{ form.username.label(class="form-label") }}{{ form.username(class="form-control", placeholder="Enter your username") }}{% for error in form.username.errors %}<span class="text-danger">{{ error }}</span>{% endfor %}</div><div class="form-group">{{ form.password.label(class="form-label") }}{{ form.password(class="form-control", placeholder="Enter your password") }}{% for error in form.password.errors %}<span class="text-danger">{{ error }}</span>{% endfor %}</div><button type="submit" class="btn btn-primary">Submit</button>
</form>

使用rener_kw字典或是在调用字段时传入参数来定义字段的额外HTML属性,通过这种方式添加css类,我们可以编写一个BootStrap风格的表单。

相关文章:

flask web学习之表单(一)

文章目录 一、使用Flask-WTF处理表单1.1 安装Flask-WTF库1.2 定义WTForms表单类常用的WTForm字段实例化字段类常用参数常用的WTForm验证器 1.3 输出HTML代码使用render_kw属性在调用字段时传入 1.4 在模板中渲染表单 在web程序中&#xff0c;表单是用户交互最常见的方式之一。用…...

@ControllerAdvice 使用场景

ControllerAdvice 是Spring 框架中的注解&#xff0c;多用在Spring MVC应用程序中。 使用场景1&#xff1a;处理异常 # 示例1 import org.apache.ibatis.javassist.NotFoundException; import org.springframework.http.HttpStatus; import org.springframework.http.Respons…...

二极管选型怎么选?常用参数要熟练~

同学们大家好&#xff0c;今天我们继续学习杨欣的《电子设计从零开始》&#xff0c;这本书从基本原理出发&#xff0c;知识点遍及无线电通讯、仪器设计、三极管电路、集成电路、传感器、数字电路基础、单片机及应用实例&#xff0c;可以说是全面系统地介绍了电子设计所需的知识…...

【小白专用】C#关于角色权限系统

&#xff08;C#&#xff09;用户、角色、权限 https://www.cnblogs.com/huangwen/articles/638050.html 权限管理系统——数据库的设计&#xff08;一&#xff09; https://www.cnblogs.com/cmsdn/p/3371576.html 权限管理系统——菜单模块的实现&#xff08;二&#xff09; …...

代码随想录算法训练营

一刷打卡记录&#xff1a; 日期打卡2023/10/25 day01二分查找有点转不过弯&#xff0c;快慢指针能理解&#xff0c;自己写也可能写不出来&#xff0c;但是能记住了&#xff0c;能看懂&#xff0c;还有其他解法待补充看完&#xff0c;花了挺长时间的2023/10/26 day02还好&#…...

统计学-R语言-3

文章目录 前言给直方图增加正态曲线的不恰当之处直方图与条形图的区别核密度图时间序列图洛伦茨曲线计算绘制洛伦茨曲线所需的各百分比数值绘制洛伦茨曲线 练习 前言 本篇文章是介绍对数据的部分图形可视化的图型展现。 给直方图增加正态曲线的不恰当之处 需要注意的是&#…...

spring动态控制定时任务

在spring框架中&#xff0c;对于简单的定时任务&#xff0c;可以使用 Scheduled 注解实现&#xff0c;在实际项目中&#xff0c;经常需要动态的控制定时任务&#xff0c;比如通过接口增加、启动、停止、删除定时任务&#xff0c;动态的改变定时任务的执行时间等。 我们可以通过…...

3. Mybatis 中SQL 执行原理

2. Mybatis 中SQL 执行原理 这里有两种方式&#xff0c;一种为常用的 Spring 依赖注入 Mapper 的方式。另一种为直接使用 SqlSessionTemplate 执行 Sql 的方式。 Spring 依赖注入 Mapper 的方式 Mapper 接口注入 SpringIOC 容器 Spring 容器在扫描 BeanDefinition 阶段会扫…...

第一次在RUST官方论坛上留言发布我的Rust板箱

第一次在RUST官方论坛上发帖子&#xff0c;有点紧张~地址在这里&#xff1a; 【My Rust Crate】obtains linux local information - The Rust Programming Language Forum (rust-lang.org)...

LabVIEW 智能化矿用定向钻机液压系统监测

简介 在矿用定向钻机的液压系统监测中&#xff0c;实现实时监控和异常预警对于保障设备运行的稳定性至关重要。传统的人工监测方法效率低下而且准确性不能满足要求&#xff0c;针对这种情况采用 LabVIEW 开发平台&#xff0c;设计并实现了一套智能化矿用定向钻机液压系统的状态…...

GO数据库操作

Golang 出色的 ORM 库为 GORM。 官网文档&#xff1a;https://gorm.io/docs/ 我们来说说增删改查的用法&#xff0c;更深入的研究可以去官网看看。 GORM功能概览&#xff1a; 关联&#xff08;有一个、有多个、属于、多对多、多态性、单表继承&#xff09;挂钩&#xff08;创…...

PyTorch简单理解ChannelShuffle与数据并行技术解析

目录 torch.nn子模块详解 nn.ChannelShuffle 用法与用途 使用技巧 注意事项 参数 示例代码 nn.DataParallel 用法与用途 使用技巧 注意事项 参数 示例 nn.parallel.DistributedDataParallel 用法与用途 使用技巧 注意事项 参数 示例 总结 torch.nn子模块详…...

MySQL 8查询语句之查询所有字段、特定字段、去除重复字段、Where判断条件

《MySQL 8创建数据库、数据表、插入数据并且查询数据》里边有我使用到的数据。 再使用下方的语句补充一些数据&#xff1a; insert into Bookbought.bookuser(id,username,userphone,userage,sex,userpassword) values (11,Book Break,22245678911,18,male,good#111); insert…...

LLaMA-Factory添加adalora

感谢https://github.com/tsingcoo/LLaMA-Efficient-Tuning/commit/f3a532f56b4aa7d4200f24d93fade4b2c9042736和https://github.com/huggingface/peft/issues/432的帮助。 在LLaMA-Factory中添加adalora 1. 修改src/llmtuner/hparams/finetuning_args.py代码 在FinetuningArg…...

多端多用户万能DIY商城系统源码:自营+多商户入驻商城系统 独立部署 带完整的安装代码包以及搭建教程

电子商务行业日新月异&#xff0c;许多企业希望能够通过线上商城拓展业务。但是&#xff0c;传统商城系统往往无法满足多样化、个性化的需求&#xff0c;而且开发周期长、成本高。罗峰就来给大家分享一款多端多用户万能DIY商城系统源码&#xff0c;搭建简单。 以下是部分代码示…...

Qt 6之七:学习资源

Qt 6之七&#xff1a;学习资源 Qt是一种跨平台的C应用程序开发框架&#xff0c;它提供了一套丰富的工具和库&#xff0c;可以帮助开发者快速构建跨平台的应用程序&#xff0c;用于开发图形用户界面&#xff08;GUI&#xff09;和非GUI应用程序。 Qt 6之一&#xff1a;简介、安…...

解决大模型的幻觉问题:一种全新的视角

在人工智能领域&#xff0c;大模型已经成为了一个重要的研究方向。然而&#xff0c;随着模型规模的不断扩大&#xff0c;一种新的问题开始浮出水面&#xff0c;那就是“幻觉”问题。这种问题的出现&#xff0c;不仅影响了模型的性能&#xff0c;也对人工智能的发展带来了新的挑…...

mysql进阶-重构表

目录 1. 原因 2. 如何重构表呢&#xff1f; 2.1 命令1&#xff1a; 2.2 命令2&#xff1a; 2.3 命令3&#xff1a; 1. 原因 正常的业务开发&#xff0c;为什么需要重构表呢&#xff1f; 原因1&#xff1a;某张表存在大量的新增和删除操作&#xff0c;导致表经历过大量的…...

Element-ui图片懒加载

核心代码 <el-image src"https://img-blog.csdnimg.cn/direct/2236deb5c315474884599d90a85d761d.png" alt"我是图片" lazy><img slot"error" src"https://img-blog.csdnimg.cn/direct/81bf096a0dff4e5fa58e5f43fd44dcc6.png&quo…...

Linux系统——DNS解析详解

目录 一、DNS域名解析 1.DNS的作用 2.域名的组成 2.1域名层级结构关系特点 2.2域名空间构成 2.3域名的四种不同类型 2.3.1延伸 2.3.2总结 3.DNS域名解析过程 3.1递归查询 3.2迭代查询 3.3一次DNS解析的过程 4.DNS系统类型 4.1缓存域名服务器 4.2主域名服务器 4…...

论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(二)

HoST框架核心实现方法详解 - 论文深度解读(第二部分) 《Learning Humanoid Standing-up Control across Diverse Postures》 系列文章: 论文深度解读 + 算法与代码分析(二) 作者机构: 上海AI Lab, 上海交通大学, 香港大学, 浙江大学, 香港中文大学 论文主题: 人形机器人…...

SCAU期末笔记 - 数据分析与数据挖掘题库解析

这门怎么题库答案不全啊日 来简单学一下子来 一、选择题&#xff08;可多选&#xff09; 将原始数据进行集成、变换、维度规约、数值规约是在以下哪个步骤的任务?(C) A. 频繁模式挖掘 B.分类和预测 C.数据预处理 D.数据流挖掘 A. 频繁模式挖掘&#xff1a;专注于发现数据中…...

【机器视觉】单目测距——运动结构恢复

ps&#xff1a;图是随便找的&#xff0c;为了凑个封面 前言 在前面对光流法进行进一步改进&#xff0c;希望将2D光流推广至3D场景流时&#xff0c;发现2D转3D过程中存在尺度歧义问题&#xff0c;需要补全摄像头拍摄图像中缺失的深度信息&#xff0c;否则解空间不收敛&#xf…...

五年级数学知识边界总结思考-下册

目录 一、背景二、过程1.观察物体小学五年级下册“观察物体”知识点详解&#xff1a;由来、作用与意义**一、知识点核心内容****二、知识点的由来&#xff1a;从生活实践到数学抽象****三、知识的作用&#xff1a;解决实际问题的工具****四、学习的意义&#xff1a;培养核心素养…...

Vue2 第一节_Vue2上手_插值表达式{{}}_访问数据和修改数据_Vue开发者工具

文章目录 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染2. 插值表达式{{}}3. 访问数据和修改数据4. vue响应式5. Vue开发者工具--方便调试 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染 准备容器引包创建Vue实例 new Vue()指定配置项 ->渲染数据 准备一个容器,例如: …...

在四层代理中还原真实客户端ngx_stream_realip_module

一、模块原理与价值 PROXY Protocol 回溯 第三方负载均衡&#xff08;如 HAProxy、AWS NLB、阿里 SLB&#xff09;发起上游连接时&#xff0c;将真实客户端 IP/Port 写入 PROXY Protocol v1/v2 头。Stream 层接收到头部后&#xff0c;ngx_stream_realip_module 从中提取原始信息…...

如何在看板中有效管理突发紧急任务

在看板中有效管理突发紧急任务需要&#xff1a;设立专门的紧急任务通道、重新调整任务优先级、保持适度的WIP&#xff08;Work-in-Progress&#xff09;弹性、优化任务处理流程、提高团队应对突发情况的敏捷性。其中&#xff0c;设立专门的紧急任务通道尤为重要&#xff0c;这能…...

前端开发面试题总结-JavaScript篇(一)

文章目录 JavaScript高频问答一、作用域与闭包1.什么是闭包&#xff08;Closure&#xff09;&#xff1f;闭包有什么应用场景和潜在问题&#xff1f;2.解释 JavaScript 的作用域链&#xff08;Scope Chain&#xff09; 二、原型与继承3.原型链是什么&#xff1f;如何实现继承&a…...

UR 协作机器人「三剑客」:精密轻量担当(UR7e)、全能协作主力(UR12e)、重型任务专家(UR15)

UR协作机器人正以其卓越性能在现代制造业自动化中扮演重要角色。UR7e、UR12e和UR15通过创新技术和精准设计满足了不同行业的多样化需求。其中&#xff0c;UR15以其速度、精度及人工智能准备能力成为自动化领域的重要突破。UR7e和UR12e则在负载规格和市场定位上不断优化&#xf…...

DeepSeek 技术赋能无人农场协同作业:用 AI 重构农田管理 “神经网”

目录 一、引言二、DeepSeek 技术大揭秘2.1 核心架构解析2.2 关键技术剖析 三、智能农业无人农场协同作业现状3.1 发展现状概述3.2 协同作业模式介绍 四、DeepSeek 的 “农场奇妙游”4.1 数据处理与分析4.2 作物生长监测与预测4.3 病虫害防治4.4 农机协同作业调度 五、实际案例大…...