django搭建城市联动,三级联动,ajax实现

博客提及了citys.html、views.py和models.py。通常citys.html属于前端页面文件,views.py和models.py常用于后端开发,涉及业务逻辑和数据模型处理。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

citys.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>城市联动</title>
</head>
<body>
    <select>
        <option>--请选择--</option>
        {% for v in data %}
        <option value="{{ v.id }}">{{ v.name }}</option>
        {% endfor %}
    </select>

    <script type="text/javascript" src="/static/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">

        // 第一步 获取 选框,绑定change事件
        $('select').live('change',function(){
            // 获取当前选中的城市id
            var cid = $(this).val()
            // 删除当前元素之后的所有同级元素
            $(this).nextAll().remove()
            // 发送ajax
            $.get('{% url 'get_city' %}',{'cid':cid},function(data){
                // 判断当前是否还有数据
                if(data.length == 0){return;}
                // 动态创建 下拉选框
                var sel = $('<select></select>')
                // 定义选项
                var ops = '<option>--请选择--</option>'
                // [{},{},{}]
                for (var i = 0; i < data.length; i++) {
                    ops+= '<option value="'+data[i].id+'">'+data[i].name+'</option>'
                }
                // 把定义的选项设置到下拉框中
                sel.html(ops)
                // 把创建的html添加到页面中
                $('body').append(sel)
            },'json')
        })
    </script>

</body>
</html>

views.py


# 城市联动页面
from django.shortcuts import render,redirect
from django.http import HttpResponse,JsonResponse
from django.core.urlresolvers import reverse

from . models import Citys




def citys(request):
    
    # 从数据库中获取所有的一级城市信息
    data = Citys.objects.filter(upid=0)

    # 分配数据
    context = {'data':data}
    # 加载模板
    return render(request,'citys.html',context)

# 获取 城市信息 
def get_city(request):
    # 获取请求的参数
    cid = request.GET.get('cid')
	'''
		根据请求的参数,查询对应的城市数据,values()获取出所有对象中的值,
		获取出来是个查询集对象,需要强转换成list,
	'''
    data = list(Citys.objects.filter(upid=cid).values())
    # select * from citys where upid=15;
    
    # 返回json数据 {} [{},{}]
    return JsonResponse(data,safe=False)



models.py

from django.db import models



# 城市数据
class Citys(models.Model):
    '''
    # id    name level upid
        1   北京   1     0
        2   昌平区  2    1
        3   沙河镇   3   2
    '''
    name = models.CharField(max_length=255)
    level = models.IntegerField()
    upid = models.IntegerField()

    class Meta:
        db_table = 'citys'


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值