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

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了循序渐进Python3（十三） --0-- django之form表单相关的知识，希望对你有一定的参考价值。

django为我们提供了form表单验证功能，下面来学习一下：

创建了django项目之后，创建app。
技术分享

技术分享
 配置urls：
  1. from django.conf.urls import url
  2. from django.contrib import admin
  3. from myapp01 import views
  5. urlpatterns = [
  6.     url(r‘^admin/‘, admin.site.urls),
  7.     url(r‘^login/‘, views.login),
  8. ]
配置views(app01.views)：
  1. from django.shortcuts import render
  2. from django import forms
  3. # Create your views here.
  6. class InputForm(forms.Form):
  7.     # 下面使用的变量名必须和html中input标签的name值相同
  8.     username = forms.CharField(required=True)
  9.     password = forms.CharField(required=True)
  11. def login(request):
  12.     if request.method == ‘POST‘:
  13.         obj = InputForm(request.POST)
  14.         ret = obj.is_valid()
  15.         print(ret,obj.data)
  16.         if ret:
  17.             print(obj.clean())
  18.         else:
  19.             print(obj.errors)
  20.     return render(request, ‘login.html‘)

配置tamplates（index.html）：
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6. </head>
  7. <body>
  8.     <div>
  9.         <div>
  10.             <input type="text" name="username" />
  11.         </div>
  12.         <div>
  13.             <input type="password" name="password" />
  14.         </div>
  15.         <input type="button" value="提交" onclick="DoSubmit();"/>
  16.     </div>
  17.     <script src="/static/jquery-2.1.4.min.js"></script>
  18.     <script>
  19.         function DoSubmit() {
  20.             var input_dic = {};
  21.             $(‘input‘).each(function () {
  22.                 var v = $(this).val();
  23.                 var n = $(this).attr(‘name‘);
  24.                 input_dic[n] = v;
  25.             });
  26.             console.log(input_dic);
  27.             $.ajax({
  28.                 url:‘/login/‘,
  29.                 type:‘POST‘,
  30.                 data:input_dic,
  31.                 success: function (rdata) {
  32.                     console.log(rdata);
  33.                 },
  34.                 error: function () {
  35.                     
  36.                 }
  37.             })
  38.         }
  39.     </script>
  40. </body>
  41. </html>

 提交之后就可以获取输入的内容。
技术分享
技术分享

 技术分享
技术分享
 
 















以上是关于循序渐进Python3（十三） --0-- django之form表单的主要内容，如果未能解决你的问题，请参考以下文章

循序渐进Python3 --4-- ?web之jQuery

循序渐进Python3 --3-- ?web之dom

循序渐进Python3 --5-- 同源策略

循序渐进Python3 --2-- web之javascript

循序渐进Python3 --6--  Ajax 实现跨域请求 jsonp 和 cors

循序渐进Python3 -- 初识socket