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

views.py
  1. from django.shortcuts import render, HttpResponse
  2. from django import forms
  3. import json
  4. # Create your views here.
  5. class InputForm(forms.Form):
  6. # 下面使用的变量名必须和html中input标签的name值相同
  7. username = forms.CharField(required=True)
  8. password = forms.CharField(required=True)
  9. def login(request):
  10. if request.method == 'POST':
  11. result = {'status':False, 'message':None}
  12. obj = InputForm(request.POST)
  13. ret = obj.is_valid()
  14. # print(ret,obj.data)
  15. if ret:
  16. print(obj.clean())
  17. result['status'] = True
  18. else:
  19. # print(obj.errors)
  20. error_str = obj.errors.as_json()
  21. result['message'] = json.loads(error_str)
  22. return HttpResponse(json.dumps(result))
  23. return render(request, 'login.html')
login.html
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. <style>
  7. .error-msg{
  8. color:red;
  9. }
  10. </style>
  11. </head>
  12. <body>
  13. <div>
  14. <div>
  15. <input type="text" name="username" />
  16. </div>
  17. <div>
  18. <input type="password" name="password" />
  19. </div>
  20. <input type="button" value="提交" onclick="DoSubmit();"/>
  21. </div>
  22. <script src="/static/jquery-2.1.4.min.js"></script>
  23. <script>
  24. function DoSubmit() {
  25. var input_dic = {};
  26. $('input').each(function () {
  27. var v = $(this).val();
  28. var n = $(this).attr('name');
  29. input_dic[n] = v;
  30. });
  31. console.log(input_dic);
  32. $.ajax({
  33. url:'/login/',
  34. type:'POST',
  35. data:input_dic,
  36. dataType: 'json',
  37. success: function (rdata) {
  38. if(rdata.status){
  39. location.href = '/index/';
  40. }else{
  41. $.each(rdata.message, function (k,v) {
  42. console.log(k,v[0].message);
  43. var tag = document.createElement('span');
  44. tag.className = 'error-msg';
  45. tag.innerText = v[0].message;
  46. $('input[name="' + k + '"]').after(tag);
  47. })
  48. }
  49. },
  50. error: function () {
  51. }
  52. })
  53. }
  54. </script>
  55. </body>
  56. </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. 最新Mysql5.7安装教程

    可以从MSQL官网下载MySQL服务器安装软件包,我下载为版本“mysql-installer-community-5.7.3.0-m13.msi”不多说 方法/步骤   1 双击进入安装,如下图: ...

  2. LeetCode OJ:Permutations(排列)

    Given a collection of numbers, return all possible permutations. For example,[1,2,3] have the follow ...

  3. Template pattern模板方法模式

    1>模板模式定义了算法的步骤,把这些步骤的实现延续到子类 2>模板模式为我们提供了一个代码复用的技巧 3>模板抽象类中可以定义具体方法.抽象方法和钩子方法 4>为了防止子类改变 ...

  4. [Hive]HiveServer2配置

    HiveServer2(HS2)是一个服务器接口,能使远程客户端执行Hive查询,并且可以检索结果.HiveServer2是HiveServer1的改进版,HiveServer1已经被废弃.HiveS ...

  5. HAWQ取代传统数仓实践(十三)——事实表技术之周期快照

    一.周期快照简介 周期快照事实表中的每行汇总了发生在某一标准周期,如一天.一周或一月的多个度量.其粒度是周期性的时间段,而不是单个事务.周期快照事实表通常包含许多数据的总计,因为任何与事实表时间范围一 ...

  6. 推荐使用typora

    最近在网上接触到一款全新的markdown写作工具--typora. 现在它已经是我的主要写作工具了. 甚至我也也会利用它安排自己的工作和任务. typora介绍 下载链接 特色:可以即时渲染mark ...

  7. (七)js函数一

    1.函数概念:函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. 语法:fuction hello(){         code...     } a)手动驱动: eg: hello(); ...

  8. not

    x = [] print(x) print(not x) print(x is None) print(not x is None) print(x is not None)

  9. 剑指offer-第六章面试中的各项能力(翻转单词的顺序VS左旋转字符串)

    //题目1:翻转单词顺序例如“Hello world!”翻转后为world! Hello. //思路:首先翻转整个字符串,然后再分别翻转每个单词. //题目2:左旋转字符串,是将字符串的前面几个(n) ...

  10. 洛谷 P1930 亚瑟王的宫殿 Camelot

    传送门 题目大意:棋盘有骑士有王,让所有点跳到一个点,求所有棋子跳的步数和,和最小. 题解:bfs+枚举 王的人生: 1):自己走到聚集点 2):某个骑士来到王这里,两个棋子一起到聚集点 3):王走几 ...