django之Form组件

最新推荐文章于 2026-06-21 15:14:42 发布

转载最新推荐文章于 2026-06-21 15:14:42 发布 · 130 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

原文链接：http://www.cnblogs.com/zhangrenguo/p/10293779.html

标签

#数据库 #前端 #python #ViewUI

本文详细介绍了 Django 中 Form 组件的功能与使用方法，包括如何创建 Form 类、配置字段及验证规则，以及如何在视图函数和 HTML 模板中应用 Form 组件。

Form组件 (什么是form组件？为什么要用rorm组件？怎么用form组件？)

　　第一大功能：对用户请求的验证--->只要用户提交数据就可以用它来验证。

　　第二大功能：生成HTML代码

from django.shortcuts import render,HttpResponse

# Create your views here.


def f1(request):
    if request.method == 'GET':
        return render(request,'f1.html')

    elif request.method == 'POST':
        user = request.POST.get('user')
        pwd = request.POST.get('pwd')
        email = request.POST.get('email')
        #如果要创建到数据库上面的要一个一个验证（用户名不能为空等等一些列验证，如果有错误要返回这个页面提示用户哪里有错）
        #1.检查是否为为空
        #2.检查格式是否正确
        # 创建到数据库
        # models.TB.objects.create(**{'username':user,'password':'pwd','e_mail':email})
        print(user,pwd,email)
        return HttpResponse('ok')

视图函数代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form id="fm" action="/f1.html/" method="POST">
        <p>用户：<input type="text" name="user"></p>
        <p>密码：<input type="password" name="pwd"></p>
        <p>邮箱：<input type="email" name="email"></p>
        <input type="submit" value="提交">

        <input type="button" value="Ajax提交" onclick="submitAjaxForm();">
    </form>
    <script src="/static/bootstrap-3.3.7-dist/js/jquery-3.3.3.js"></script>
    <script>
        function submitAjaxForm() {
            $.ajax({
                url:'/f1.html/',
                type:'POST',
                date:$('#fm').serialize(),
                success:function (arg) {
                    console.log(arg);
                }
            })
        }
    </script>
</body>
</htm

模板HTML代码

如果我们不使用Django的Form组件的话无论何种提交方式提交都需要自己为为每个字段写验证。

为什么要用form组件？--->用来验证用户发来的请求！

怎么用From组件？

第一个步骤：先创建一个类

第二个步骤：类中创建字段，这个字段包含正则表达式。

第三个步骤：

　　GET:

　　在页面成生成HTML对象--->obj = 类（）

　　在前端obj.字段

第四个步骤：

　　POST：

　　obj = 类（requets.POST）

　　判断验证成功：

　　　　obj.cleaned_data

　　判断验证失败：

　　　　obj.errors

　　在前端拿到某一个错误

from django.shortcuts import render,HttpResponse,redirect

# Create your views here.


from django import forms
from django.forms import fields
class F1From(forms.Form):
    user = fields.CharField(
        max_length=18,
        min_length=6,
        required=True,
        error_messages = {
            'required':'用户名不能为空',
            'max_length':'太长了',
            'min_length':'太短了',
        }
    )    #最长18，最短6，不能为空
    pwd = fields.CharField(max_length=20,min_length=8,required=True)     #最长20，最短8，不能为空
    age = fields.IntegerField(required=True)
    email = fields.EmailField(required=True)


def f1(request):
    if request.method == 'GET':
        obj = F1From()
        return render(request,'f1.html',{'obj':obj})

    elif request.method == 'POST':

        obj = F1From(request.POST)      #类加括号创建对象,  request.POST里面有所有提交过来的数据。
        v = obj.is_valid()       #是否验证成功
        if v:
            print('验证成功',obj.cleaned_data)
            return redirect('https://www.cnblogs.com/zhangrenguo/')
        else:
            print('验证失败',obj.errors)
            return render(request,'f1.html',{'obj':obj})

Form 表单提交的视图函数层

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form action="/f1.html/" method="POST">
        <p>用户：{{ obj.user }}{{ obj.errors.user.0 }} </p>
        <p>密码：{{ obj.pwd }}{{ obj.errors.pwd.0 }} </p>
        <p>age: {{ obj.age }}{{ obj.errors.age.0 }} </p>
        <p>邮箱：{{ obj.email }}{{ obj.errors.email.0 }} </p>
        <input type="submit" value="提交">
    </form>
</body>
</html>

模板HTML代码

一、Form类

创建Form类时，主要涉及到【字段】和【插件】，字段用于对用户请求数据的验证，插件用于自动生成HTML;

1、Django内置字段如下：

Field
    required=True,               是否允许为空
    widget=None,                 HTML插件
    label=None,                  用于生成Label标签或显示内容
    initial=None,                初始值
    help_text='',                帮助信息(在标签旁边显示)
    error_messages=None,         错误信息 {'required': '不能为空', 'invalid': '格式错误'}
    show_hidden_initial=False,   是否在当前插件后面再加一个隐藏的且具有默认值的插件（可用于检验两次输入是否一直）
    validators=[],               自定义验证规则
    localize=False,              是否支持本地化
    disabled=False,              是否可以编辑
    label_suffix=None            Label内容后缀
 
 
CharField(Field)
    max_length=None,             最大长度
    min_length=None,             最小长度
    strip=True                   是否移除用户输入空白
 
IntegerField(Field)
    max_value=None,              最大值
    min_value=None,              最小值
 
FloatField(IntegerField)
    ...
 
DecimalField(IntegerField)
    max_value=None,              最大值
    min_value=None,              最小值
    max_digits=None,             总长度
    decimal_places=None,         小数位长度
 
BaseTemporalField(Field)
    input_formats=None          时间格式化   
 
DateField(BaseTemporalField)    格式：2015-09-01
TimeField(BaseTemporalField)    格式：11:12
DateTimeField(BaseTemporalField)格式：2015-09-01 11:12
 
DurationField(Field)            时间间隔：%d %H:%M:%S.%f
    ...
 
RegexField(CharField)
    regex,                      自定制正则表达式
    max_length=None,            最大长度
    min_length=None,            最小长度
    error_message=None,         忽略，错误信息使用 error_messages={'invalid': '...'}
 
EmailField(CharField)      
    ...
 
FileField(Field)
    allow_empty_file=False     是否允许空文件
 
ImageField(FileField)      
    ...
    注：需要PIL模块，pip3 install Pillow
    以上两个字典使用时，需要注意两点：
        - form表单中 enctype="multipart/form-data"
        - view函数中 obj = MyForm(request.POST, request.FILES)
 
URLField(Field)
    ...
 
 
BooleanField(Field)  
    ...
 
NullBooleanField(BooleanField)
    ...
 
ChoiceField(Field)
    ...
    choices=(),                选项，如：choices = ((0,'上海'),(1,'北京'),)
    required=True,             是否必填
    widget=None,               插件，默认select插件
    label=None,                Label内容
    initial=None,              初始值
    help_text='',              帮助提示
 
 
ModelChoiceField(ChoiceField)
    ...                        django.forms.models.ModelChoiceField
    queryset,                  # 查询数据库中的数据
    empty_label="---------",   # 默认空显示内容
    to_field_name=None,        # HTML中value的值对应的字段
    limit_choices_to=None      # ModelForm中对queryset二次筛选
     
ModelMultipleChoiceField(ModelChoiceField)
    ...                        django.forms.models.ModelMultipleChoiceField
 
 
     
TypedChoiceField(ChoiceField)
    coerce = lambda val: val   对选中的值进行一次转换
    empty_value= ''            空值的默认值
 
MultipleChoiceField(ChoiceField)
    ...
 
TypedMultipleChoiceField(MultipleChoiceField)
    coerce = lambda val: val   对选中的每一个值进行一次转换
    empty_value= ''            空值的默认值
 
ComboField(Field)
    fields=()                  使用多个验证，如下：即验证最大长度20，又验证邮箱格式
                               fields.ComboField(fields=[fields.CharField(max_length=20), fields.EmailField(),])
 
MultiValueField(Field)
    PS: 抽象类，子类中可以实现聚合多个字典去匹配一个值，要配合MultiWidget使用
 
SplitDateTimeField(MultiValueField)
    input_date_formats=None,   格式列表：['%Y--%m--%d', '%m%d/%Y', '%m/%d/%y']
    input_time_formats=None    格式列表：['%H:%M:%S', '%H:%M:%S.%f', '%H:%M']
 
FilePathField(ChoiceField)     文件选项，目录下文件显示在页面中
    path,                      文件夹路径
    match=None,                正则匹配
    recursive=False,           递归下面的文件夹
    allow_files=True,          允许文件
    allow_folders=False,       允许文件夹
    required=True,
    widget=None,
    label=None,
    initial=None,
    help_text=''
 
GenericIPAddressField
    protocol='both',           both,ipv4,ipv6支持的IP格式
    unpack_ipv4=False          解析ipv4地址，如果是::ffff:192.0.2.1时候，可解析为192.0.2.1， PS：protocol必须为both才能启用
 
SlugField(CharField)           数字，字母，下划线，减号（连字符）
    ...
 
UUIDField(CharField)           uuid类型
    ...

2、Django内置插件如下：

TextInput(Input)
NumberInput(TextInput)
EmailInput(TextInput)
URLInput(TextInput)
PasswordInput(TextInput)
HiddenInput(TextInput)
Textarea(Widget)
DateInput(DateTimeBaseInput)
DateTimeInput(DateTimeBaseInput)
TimeInput(DateTimeBaseInput)
CheckboxInput
Select
NullBooleanSelect
SelectMultiple
RadioSelect
CheckboxSelectMultiple
FileInput
ClearableFileInput
MultipleHiddenInput
SplitDateTimeWidget
SplitHiddenDateTimeWidget
SelectDateWidget

3、常用选择插件

# 单radio，值为字符串
# user = fields.CharField(
#     initial=2,
#     widget=widgets.RadioSelect(choices=((1,'上海'),(2,'北京'),))
# )
 
# 单radio，值为字符串
# user = fields.ChoiceField(
#     choices=((1, '上海'), (2, '北京'),),
#     initial=2,
#     widget=widgets.RadioSelect
# )
 
# 单select，值为字符串
# user = fields.CharField(
#     initial=2,
#     widget=widgets.Select(choices=((1,'上海'),(2,'北京'),))
# )
 
# 单select，值为字符串
# user = fields.ChoiceField(
#     choices=((1, '上海'), (2, '北京'),),
#     initial=2,
#     widget=widgets.Select
# )
 
# 多选select，值为列表
# user = fields.MultipleChoiceField(
#     choices=((1,'上海'),(2,'北京'),),
#     initial=[1,],
#     widget=widgets.SelectMultiple
# )
 
 
# 单checkbox
# user = fields.CharField(
#     widget=widgets.CheckboxInput()
# )
 
 
# 多选checkbox,值为列表
# user = fields.MultipleChoiceField(
#     initial=[2, ],
#     choices=((1, '上海'), (2, '北京'),),
#     widget=widgets.CheckboxSelectMultiple
# )