zoukankan      html  css  js  c++  java
  • django 使用form组件提交数据之form表单提交

    django的form组件可以减少后台在进行一些重复性的验证工作,极大降低开发效率。

    最近遇到一个问题:

      当使用form表单提交数据后,如果数据格式不符合后台定义的规则,需要重新在前端页面填写数据。

    分析问题:

      由于form的POST 请求发出去后会刷新整个页面,自然无法保留上次输入的内容。

    解决问题: 

      采用ajax的方式发出请求,避免刷新整个页面。

    ajax是脑海里第一个冒出的想法,但经过了解form组件内部的更多参数以及原理,发现其实也可以在form发出

    POST请求时保留上次输入的内容。这里面有个关键是: 可以使用form组件在前端页面中生成html标签。

    下面贴下代码:

    1.先在后台创建基于Form的类,在类中创建字段以此定义规则。

    from django.forms import  Form,fields
    class RegisterForm(Form):
        user = fields.CharField(
            min_length=6,
            max_length=16,
            error_messages={'min_length':'太短了','max_length':'太长了'},
            label='用户名',
        )
        password = fields.CharField(
            min_length=6,
            max_length=16,
            error_messages={'min_length':'太短了','max_length':'太长了'},
            label='密码',
        )
        email = fields.EmailField(
            label='邮箱',
        )

    2.前端页面代码

    代码中obj是从后台传过来的,代表的是Form类的对象。在Django中,可以将obj传到前端。

    通过obj点出类中的字段名称。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <form method="POST" action="/register/" novalidate>
            <p>
                {{ obj.user.label }}{{ obj.user }} {{ obj.errors.user.0 }}  
            </p>
            <p>
               {{ obj.password.label }} {{ obj.password }} {{ obj.errors.password.0 }}
            </p>
            <p>
                {{ obj.email.label }} {{ obj.email }} {{obj.errors.email.0 }}
            </p>
            <input type="submit"/>
        </form>
    </body>
    </html>

    3.后台逻辑代码

    def register(request):
        if request.method=='GET':
            obj = RegisterForm()    #当通过get请求来到注册页面时,没有携带数据,obj生成的html标签就自然没有values值      
            return render(request,'register.html',{'obj':obj})
        else:
            obj=RegisterForm(request.POST)#post请求发来了数据,此时obj中有values
            v = obj.is_valid()#验证
            if v:
                print(obj.cleaned_data)#验证正确时在后台输出数据
                return redirect('http://www.baidu.com')
            else:
                print(obj.errors) #错误信息
                print(obj['user']) #obj其实打印出来是一串html形式的字符串 此句得到的结果是 <input type="text" name="user" maxlength="16" minlength="6" required id="id_user">
                return render(request,'register.html',{'obj':obj})#传回前端的obj,包含数据

    print(obj)后得出的结果

    <tr><th><label for="id_user">用户名:</label></th><td><ul class="errorlist"><li>This field is required.</li></ul><input type="text" name="user" maxlength="16" minlength="6" required id="id_user"></td></tr>
    <tr><th><label for="id_password">密码:</label></th><td><ul class="errorlist"><li>This field is required.</li></ul><input type="text" name="password" maxlength="16" minlength="6" required id="id_password"></td></tr>
    <tr><th><label for="id_email">邮箱:</label></th><td><ul class="errorlist"><li>This field is required.</li></ul><input type="email" name="email" required id="id_email"></td></tr>

  • 相关阅读:
    如何在tomcat安装部署php项目
    十大建站开源程序
    虚拟主机、VPS、云主机以及独立服务器的关系
    heritrix启动问题修正
    网页布局:float与position的区别
    C#中利用委托实现多线程跨线程操作
    Java Service Wrapper配置详解
    Windows7部署WordPress傻瓜式教程(IIS7.5+MySQL+PHP+WordPress)
    关于favicon.ico的使用
    使用JAVA对字符串进行DES加密解密(修正问题)
  • 原文地址:https://www.cnblogs.com/xiaohuyi/p/10325708.html
Copyright © 2011-2022 走看看