zoukankan      html  css  js  c++  java
  • Form组件,用ajax发送到后台需要的注意事项

    form通过ajax发送到后台,

    后台无法直接返回跳转页面,因为,ajax无法接受跳转命令

    后台验证完成后,错误信息因为不是常规Python的字典格式,所以需要引入ErrorDict

    views文件

    import json
    
    def ajax(request):
        if request.method =="GET":
            obj=AjaxForm()
            return render(request,'ajax.html',{"obj":obj})
        else:
            ret={"status":"dd",'message':None}
            obj=AjaxForm(request.POST)
            if obj.is_valid():
                print(obj.cleaned_data)
                ret['status']='money'
                return HttpResponse(json.dumps(ret))
            else:
                print(obj.errors)
                from django.forms.utils import ErrorDict   #因为判断后的错误信息不是Python常规数据类型,所以需要继承ErrorDict
                ret['message']=obj.errors
                return HttpResponse(json.dumps(ret))

    html文件

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    
    <form action="" method="post" novalidate id="formData">
        {% csrf_token %}
    
        {{   obj.as_p }}
        <input type="button" value="提交" id="btn">
    </form>
    
    <script src="/static/jquery-3.3.1.js"></script>
    <script>
        $(function () {
            $('#btn').click(function () {
                $.ajax({
                    url:'/ajax/',
                    type:'post',
                    data:$('#formData').serialize(),
                    dataTypr:"JSON",
                    success:function (arg) {
                        //arg:状态,错误信息
                        if (arg.status == 'money'){
                            window.location.href='http://www.baidu.com'
                        }
    
                        console.log(arg);
                    }
                })
            })
        })
    
    
    </script>
    </body>
    </html>
  • 相关阅读:
    Render Props
    react16新特性
    typescript
    calc
    类数组
    promise fullfill状态时 value是一个promise,那么此promise.then()里面收到的是什么
    M个同样的苹果放N个同样的盘子,允许有盘子空着, 问有多少种放法?
    history
    js创建二维数组
    钉钉-E应用开发初体验(企业内部应用)
  • 原文地址:https://www.cnblogs.com/lhqlhq/p/9184178.html
Copyright © 2011-2022 走看看