ajax处理urlencoded的装饰器,ajax上传文件,分页器组件,forms组件
一.ajax处理前端urlencoded方式传来的字典装饰器
def outer(func): def inner(request,*args,**kwargs): try: request.POST=json.loads(request.body) except Exception as e: print(e) ret = func(request,*args,**kwargs) return ret return inner
二.ajax上传文件
<h1>基于ajax上传文件</h1> <p>名字:<input type='text' name='name'></p> <p>文件:<input type='file' name='myfile'></p> <button id='filebtn'>ajax上传文件</button> <script> $('#filebtn').click(function)(){ //js取到文件 var myfile = $('#id_myfile')[0].files[0] //生成一个FormData对象 var formdata = new FormData() //放值 formdata.append('name',$('#id_name').val()) //放文件 formdata.append('myfile',myfile) $.ajax({ url:'/fileupload/', type:'post', //这两个必须写, processData:false, //不预处理数据 因为FormData 已经做了 contentType:false, //我不指定编码了 因为FormData 已经做了 data: formdata, success: function(data){ console.log(data) } }) } </script>
三.分页器案例:
前端:
<div class="row"> <div class="col-md-6 col-md-offset-3"> <table class="table"> <thead> <tr> <th>序号</th> <th>姓名</th> <th>年龄</th> </tr> </thead> <tbody> {% for user in page %} <tr> <td>{{ forloop.counter }}</td> <td>{{ user.name }}</td> <td>{{ user.age }}</td> </tr> {% endfor %} </tbody> </table> <nav aria-label="Page navigation"> <ul class="pagination"> {% if page.has_previous %} <li> <a href="/pagetest/?page={{ page.previous_page_number }}" aria-label="Previous"> <span aria-hidden="true">上一页</span> </a> </li> {% else %} <li class="disabled"> <a href="#" aria-label="Previous"> <span aria-hidden="true">上一页</span> </a> </li> {% endif %} {% for foo in page_range %} {# 判断当前页面是否是循环到的页码,如果是,加active#} {% if currentpage == foo %} <li class="active"><a href="/pagetest/?page={{ foo }}">{{ foo }}</a></li> {% else %} <li><a href="/pagetest/?page={{ foo }}">{{ foo }}</a></li> {% endif %} {% endfor %} {% if page.has_next %} <li> <a href="/pagetest/?page={{ page.next_page_number }}" aria-label="Next"> <span aria-hidden="true">下一页</span> </a> </li> {% else %} <li class="disabled"> <a href="" aria-label="Next"> <span aria-hidden="true">下一页</span> </a> </li> {% endif %} </ul> </nav> </div> </div>
后端:
from django.core.paginator import Paginator def pagetest(request): userlist = models.UserInfo.objects.all().order_by('pk') paginator = Paginator(userlist, 20) try: currentpage = int(request.GET.get('page',1)) page = paginator.page(currentpage) except Exception as e: currentpage = 1 page = paginator.page(currentpage) # 传入页码数,拿到的就是当前页对象 page = paginator.page(currentpage) # 1 总页数是否大于11, 当总页数大于11 if paginator.num_pages > 11: # 1.1 当前页码数是否小于6 if currentpage <=6: # 1.1.1 当当前页码小于6的时候,就生成11个页码数 page_range = range(1, 12) # 1.2 当当前页码 +5 大于等于总页码数 elif currentpage + 5 >= paginator.num_pages: # 1.2.1 往后推11个页码数 page_range = range(paginator.num_pages-10, paginator.num_pages +1) # 1.3 生成一个左5 右5的区间 else: page_range = range(currentpage - 5, currentpage + 6 ) # 2 总页码数不大于11, 有多少,显示多少 else: page_range = paginator.page_range return render(request,'pagetest.html',locals())
四.forms组件
后端:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="" method="post" novalidate> <p>用户名: <input type="text" name="name"></p> <p>密码: <input type="password" name="pwd"></p> <p>邮箱: <input type="email" name="email"></p> <input type="submit" value="提交"> </form> <hr> <h1>forms的模板渲染之一(推荐)</h1> <form action="" method="post" novalidate> <p>用户名: {{ myform.name }}</p> <p>密码: {{ myform.pwd }}</p> <p>邮箱: {{ myform.email }}</p> <input type="submit" value="提交"> </form> <h1>forms的模板渲染之二(推荐)</h1> <form action="" method="post" novalidate> {% for item in myform %} <p>{{ item.label }}:{{ item }}</p> {% endfor %} <input type="submit" value="提交"> </form> <h1>forms的模板渲染之三</h1> <form action="" method="post" novalidate> {# <table>#} {# {{ myform.as_table }}#} {# </table>#} {{ myform.as_p }} <input type="submit" value="提交"> </form> </body> </html>
前端:
from django import forms # 继承Form这个类 class MyForm(forms.Form): # 限制name这个字段最长为8,最短为3 name=forms.CharField(min_length=3,max_length=8,label='用户名',required=True,error_messages={'min_length':'至少为3','max_length':'最长为8,您太长了'}) pwd=forms.CharField(min_length=3,max_length=8,label='密码',error_messages={'min_length':'至少为3','max_length':'最长为8,您太长了'}) email=forms.EmailField(label='邮箱',error_messages={'invalid':'邮箱格式不合法','required':'这个字段必填'}) def register(request): if request.method == 'GET': # 生成一个空的form对象 myform=MyForm() return render(request,'register.html',locals()) else: dic = {'name':'lqzfasdgasgasd','pwd':'1','email':'5555'} myform = MyForm(dic) # 所有字典都校验通过,它就是True的 if myform.is_valid(): # 取出校验通过的数据 clean_data = myform.cleaned_data print(clean_data) else: # 所有的错误信息 # 只要是校验通过的值,都在cleaned_data中放着 print(myform.cleaned_data) print(myform.errors.as_data()) # 字典类型 print(type(myform.errors)) print(myform.errors.get('name')) return HttpResponse('ok')
