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')