django省市区

最新推荐文章于 2022-06-16 21:14:26 发布

我只是个小测试

最新推荐文章于 2022-06-16 21:14:26 发布

阅读量721

点赞数

分类专栏： Django入门前端学习

本文链接：https://blog.csdn.net/qq_41992088/article/details/86704032

版权

Django入门同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

前端学习

4 篇文章 0 订阅

订阅专栏

urls.py：

from django.conf.urls import url
import views

urlpatterns = [

    url(r'^area/$',views.area),
    url(r'^area/(\d+)/$',views.area1),
    url(r'^area/city(\d+)/$',views.area2),
    url(r'^area/district(\d+)/$',views.area3)
]

views.py

#coding=utf-8
from django.shortcuts import render
from django.conf import settings
import os
from django.http import HttpResponse,JsonResponse
from django.core.paginator import Paginator
from models import *

# 省市区
def area(request):
    return render(request,'booktest/area.html')

def area1(requset,id):
    id1=int(id)
    if id1==0:
        data = AreaInfo.objects.filter(pid__isnull=True)
    else:
        data=[{}]

    list=[]
    for area in data:
        list.append([area.id,area.title])
        

    return JsonResponse({'data':list})
    数据格式：{ [ [], [], [], [],[] ] }

def area2(request,id):
    id1=int(id)
    data =  AreaInfo.objects.filter(pid_id=id1)
    list=[]

    for item in data:
        list.append({'id':item.id,'title':item.title})
    return JsonResponse({'data':list})
    print (list)
    # 数据格式 {'data':[{'id':1,'title':北京}，{'id':2,'title':上海}，{}。。。。。]}

def area3(request,id):
    id1 = int(id)
    data =  AreaInfo.objects.filter(pid_id=id1)
    list=[]

    for item in data:
        list.append({'id':item.id,'title':item.title})
    return JsonResponse({'data':list})
    print (list)

area.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>area</title>
    <script src="/static/booktest/jquery-1.12.4.min.js"></script>
    <script>
        $(function () {
            pro=$('#province')
            city=$('#city')
            district=$('#district')
            $.get('/area/0/',function(dic){
                $.each(dic.data,function (index,item) {
                    pro.append('<option value="'+item[0]+'">'+item[1]+'</option>')

                })
            })
            pro.change(function () {
                city.empty().append('<option value="" >请选择市</option>')
                $.get('/area/city'+pro.val()+'/',function (list) {
                    $.each(list.data,function (index,item) {
                        city.append('<option value="'+item.id+'">'+item.title+'</option>')

                    })
                })
            })
            city.change(function () {
                district.empty().append('<option value="" >请选择区</option>')
                $.get('/area/district'+city.val()+'/',function (list) {
                    $.each(list.data,function (index,item) {
                        district.append('<option value="'+item.id+'">'+item.title+'</option>')

                    })
                })
            })
        });
    </script>
</head>
<body>
<select id="province" style="background: deepskyblue">
    <option value="" >请选择省</option>
</select>

<select id="city" style="background: yellow">
    <option value="" >请选择市</option>
</select>

<select id="district" style="background: red">
    <option value="" >请选择区</option>
</select>

</body>
</html>