在上一次的代码上做出进一步修改,使之能在页面上显示报错信息。

views.py
  1. from django.shortcuts import render, HttpResponse
    2. 

  2. from django import forms
    3. 

  3. import json
    4. 

  4. # Create your views here.
    5. 

    6. 

    7. 

  7. class InputForm(forms.Form):
    8. 

  8.     # 下面使用的变量名必须和html中input标签的name值相同
    9. 

  9.     username = forms.CharField(required=True)
    10. 

  10.     password = forms.CharField(required=True)
    11. 

    12. 

    13. 

  13. def login(request):
    14. 

  14.     if request.method == 'POST':
    15. 

  15.         result = {'status':False, 'message':None}
    16. 

  16.         obj = InputForm(request.POST)
    17. 

  17.         ret = obj.is_valid()
    18. 

  18.         # print(ret,obj.data)
    19. 

  19.         if ret:
    20. 

  20.             print(obj.clean())
    21. 

  21.             result['status'] = True
    22. 

  22.         else:
    23. 

  23.             # print(obj.errors)
    24. 

  24.             error_str = obj.errors.as_json()
    25. 

  25.             result['message'] = json.loads(error_str)
    26. 

  26.         return HttpResponse(json.dumps(result))
    27. 

  27.     return render(request, 'login.html')
login.html
  1. <!DOCTYPE html>
    2. 

  2. <html lang="en">
    3. 

  3. <head>
    4. 

  4.     <meta charset="UTF-8">
    5. 

  5.     <title>Title</title>
    6. 

  6.     <style>
    7. 

  7.         .error-msg{
    8. 

  8.             color:red;
    9. 

  9.         }
    10. 

  10.     </style>
    11. 

  11. </head>
    12. 

  12. <body>
    13. 

  13.     <div>
    14. 

  14.         <div>
    15. 

  15.             <input type="text" name="username" />
    16. 

  16.         </div>
    17. 

  17.         <div>
    18. 

  18.             <input type="password" name="password" />
    19. 

  19.         </div>
    20. 

  20.         <input type="button" value="提交" onclick="DoSubmit();"/>
    21. 

  21.     </div>
    22. 

  22.     <script src="/static/jquery-2.1.4.min.js"></script>
    23. 

  23.     <script>
    24. 

  24.         function DoSubmit() {
    25. 

  25.             var input_dic = {};
    26. 

  26.             $('input').each(function () {
    27. 

  27.                 var v = $(this).val();
    28. 

  28.                 var n = $(this).attr('name');
    29. 

  29.                 input_dic[n] = v;
    30. 

  30.             });
    31. 

  31.             console.log(input_dic);
    32. 

  32.             $.ajax({
    33. 

  33.                 url:'/login/',
    34. 

  34.                 type:'POST',
    35. 

  35.                 data:input_dic,
    36. 

  36.                 dataType: 'json',
    37. 

  37.                 success: function (rdata) {
    38. 

  38.                     if(rdata.status){
    39. 

  39.                         location.href = '/index/';
    40. 

  40.                     }else{
    41. 

  41.                         $.each(rdata.message, function (k,v) {
    42. 

  42.                             console.log(k,v[0].message);
    43. 

  43.                             var tag = document.createElement('span');
    44. 

  44.                             tag.className = 'error-msg';
    45. 

  45.                             tag.innerText = v[0].message;
    46. 

  46.                             $('input[name="' + k + '"]').after(tag);
    47. 

  47.                         })
    48. 

  48.                     }
    49. 

  49.                 },
    50. 

  50.                 error: function () {
    51. 

    52. 

  52.                 }
    53. 

  53.             })
    54. 

  54.         }
    55. 

  55.     </script>
    56. 

  56. </body>
    57. 

  57. </html>
效果图：
 

循序渐进Python3（十三） --1-- django之form表单的更多相关文章

  1. Django的form表单

    html的form表单 django中,前端如果要提交一些数据到views里面去,需要用到 html里面的form表单. 例如: # form2/urls.py from django.contrib ...

  2. Django 11 form表单（状态保持session、form表单及注册实现）

    Django 11 form表单(状态保持session.form表单及注册实现) 一.状态保持 session 状态保持 #1.http协议是无状态的:每次请求都是一次新的请求,不会记得之前通信的状 ...

  3. 转载：Django之form表单

    转载: 一.使用form类创建一个表单 先定义好一个RegForm类: forms.py from django import forms # 导入forms类 class NameForm(form ...

  4. Django--分页器（paginator）、Django的用户认证、Django的FORM表单

    分页器(paginator) >>> from django.core.paginator import Paginator >>> objects = ['joh ...

  5. 循序渐进Python3（十三） --0-- django之form表单

    django为我们提供了form表单验证功能,下面来学习一下: 武sir博客:http://www.cnblogs.com/wupeiqi/articles/5246483.html  创建了djan ...

  6. django之form表单验证

    django中的Form一般有两种功能: 输入html 验证用户输入 #!/usr/bin/env python # -*- coding:utf- -*- import re from django ...

  7. django中form表单的提交：

    一,关于表单: 表单在百度百科的解释:   表单在网页中主要负责数据采集功能.一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法. 表单域 ...

  8. Day19 Django之Form表单验证、CSRF、Cookie、Session和Model操作

    一.Form表单验证 用于做用户提交数据的验证1.自定义规则 a.自定义规则(类,字段名==html中的name值)b.数据提交-规则进行匹配代码如下: """day19 ...

  9. Django的form表单之文件上传

    在生成input标签的时候可以指定input标签的类型为file类型 <!DOCTYPE html> <html lang="en"> <head&g ...

  10. 【django之form表单】

    一.构建一个表单 假设你想在你的网站上创建一个简单的表单,以获得用户的名字.你需要类似这样的模板: <form action="/your-name/" method=&qu ...

随机推荐

  1. [转载]SVN trunk、branch、tag的用法

    Subversion有一个很标准的目录结构,是这样的. 比如项目是proj,svn地址为svn://proj/,那么标准的svn布局是 svn://proj/|+-trunk+-branches+-t ...

  2. Integer类分析（jdk8）

    一.构造函数 1. Integer类继承Number类,实现Comparable接口,重写了compareTo()方法. 2. Integer最小值为-2147483648,最大值为214748364 ...

  3. js控制iframe的刷新（页面局部刷新）

    今天遇到个问题,后台会员审核之后,页面内的会员审核状态要及时改变,但又不能指望用户手动刷新(用户体验很不好) 如果审核页面和显示审核状态时同在一个html页面的话,那么直接用js改变div内部的文本就 ...

  4. 【MFC】VC界面绘制双缓存

    VC界面绘制双缓存 转载请注明原文网址: http://www.cnblogs.com/xianyunhe/archive/2011/11/20/2255811.html 1.闪屏的问题在GDI的绘图 ...

  5. HihoCoder1041 国庆出游 树形DP第四题

    小Hi和小Ho准备国庆期间去A国旅游.A国的城际交通比较有特色:它共有n座城市(编号1-n):城市之间恰好有n-1条公路相连,形成一个树形公路网.小Hi计划从A国首都(1号城市)出发,自驾遍历所有城市 ...

  6. Python之namedtuple源码分析

    namedtuple()函数根据提供的参数创建一个新类,这个类会有一个类名,一些字段名和一个可选的用于定义类行为的关键字,具体实现如下 namedtuple函数源码 from keyword impo ...

  7. linux学习 XShell上传、下载本地文件到linux服务器

    (一)通过命令行的方式 1.linux服务器端设置 在linux主机上,安装上传下载工具包rz及sz; 如果不知道你要安装包的具体名称,可以使用yum provides */name 进行查找系统自带 ...

  8. SpringMVC的启动过程

    前言 下面是一个SpringMVC应用的配置文件,需要注意两个地方,一个是ContextLoaderListener,一个是dispatcherServlet.web容器正是通过这两个配置才和spri ...

  9. TIME_WAIT过多及解决

         最近用http_load做压测,跑出来一大串“Cannot assign requested address ”的错误,查了一下,是TIME_WAIT过多导致的.因为短时间内有太多连接,所以 ...

  10. 7天学会HTML-Day01

    HTML初步 关键词: B/S C/S .服务器访问原理.标签.html特性.列表.图片 1.B/S 和C/S 架构 B/S -> browser/server 浏览器服务器架构 C/S -&g ...