Django自关联实现多级联动查询实例


Posted in Python onMay 19, 2020

1 问题引出

我们在开发网站的时候可能会遇到这种情况,多个字段之间有一定的关联性,比如省市县,选择省,之后下一个选择框的值则为该省的市集合,选择市之后下一个选择框的值为该市的县集合。

一种实现方式是,建立三个模型表,用外键一对多方式,显然这样是不太合理的。Django提供了自关联的实现,模型自身关联,即一条数据关联另一条数据。

本文以省市县为案例介绍其具体实现方法。

2 具体实现

2.1 建立数据表Model

在model.py中建立数据表

class AdressInfo(models.Model):
  address = models.CharField(max_length = 200, null = True, blank = True, verbose_name = ‘地址')
  pid = models.ForeignKey(‘self' , null = True, blank = True, verbose_name = ‘自关联')

  def __str__(self):
    return self.adress

说明:

name :省市县的名字
pid:外键,self自关联,这里也可以使用 AdressInfo
null:为True表示可以为空,因为省级行政单位没有父级
blank:为True表示admin后台数据写入的时候可以允许为空

然后迁移数据库

python manage.py makemigrations
python manage.py migrate

这时可以在后台数据表中添加数据

2.2 后端url和view函数

将前端网页地址映射为对应函数,用正则表达式获取前端传输的pid

url.py 文件

urlpatterns = [
  url(r'^addr/(\d+)$', Address.addrAPI, name = 'Addr)
]

view.py 文件

def addrAPI(request,addr_id): # 接收一个参数的id,指model中的pid属性对应的字段
  if (int(addr_id) == 0): # 为0表示查询省,省的pid_id为null
    address_data = AddressInfo.objects.filter(pid__isnull = True).values('id','address')
  else: # 查询市或其他县
    address_data = AddressInfo.objects.filter(pid_id = int(addr_id)).values('id','address')

  area_list = []
  for a in address_data:
    area_list.append({'id':a['id'], 'address':a['address']})

  return JsonResponse(area_list, safe = False)

2.3 前端template

前端主要是显示和执行操作相应,具体实现是通过下拉框值的改变触动相应函数。这里只写关键的地方。

address.html 文件

<body>
  <select id = 'pro'>
    <option value=''>请选择省</option>
  </select>
  <select id = 'city'>
    <option value=''>请选择市</option>
  </select>
  <select id = 'dis'>
    <option value=''>请选择县</option>
  </select>
</body>

<script>
address = function(a, b)
{
  $.get('/addr/'+a, function (dic){
    $.each(dic, function(index, item){
      b.append('<option value="' + item.id + '">' + item.address + '</option>')
    })
  })
}

$(function (){
  // 获取省市县元素
  pro = $('#pro')
  city = $('#city')
  dis = $('#dis')

  // 查询省信息
  address(0, pro)

  // 根据省查询市信息
  pro.change(function(){
    city.empty().append('<option value="">请选择市</option>');
    dis.empty().append('<option value="">请选择县</option>');
    adress(this.value, city)
  })
  // 根据市查询县信息
  city.change(function(){
    dis.empty().append('<option value="">请选择县</option>');
    adress(this.value, dis)
  })
})
</script>

3 效果

Django自关联实现多级联动查询实例

Django自关联实现多级联动查询实例

以上这篇Django自关联实现多级联动查询实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Python 相关文章推荐
零基础写python爬虫之urllib2使用指南
Nov 05 Python
python使用Image处理图片常用技巧分析
Jun 01 Python
在Python的Flask框架中构建Web表单的教程
Jun 04 Python
python生成式的send()方法(详解)
May 08 Python
Python3 修改默认环境的方法
Feb 16 Python
python实现简单图片物体标注工具
Mar 18 Python
django的ORM操作 增加和查询
Jul 26 Python
python3 正则表达式基础廖雪峰
Mar 25 Python
Python3.9 beta2版本发布了,看看这7个新的PEP都是什么
Jun 10 Python
Python调用OpenCV实现图像平滑代码实例
Jun 19 Python
Requests什么的通通爬不了的Python超强反爬虫方案!
May 20 Python
PyQt5实现多张图片显示并滚动
Jun 11 Python
Python的Django框架实现数据库查询(不返回QuerySet的方法)
May 19 #Python
django 数据库返回queryset实现封装为字典
May 19 #Python
使用PyQt的QLabel组件实现选定目标框功能的方法示例
May 19 #Python
python 数据分析实现长宽格式的转换
May 18 #Python
如何把外网python虚拟环境迁移到内网
May 18 #Python
python 实现 hive中类似 lateral view explode的功能示例
May 18 #Python
pandas dataframe 中的explode函数用法详解
May 18 #Python
You might like
php+dbfile开发小型留言本
2006/10/09 PHP
基于HBase Thrift接口的一些使用问题及相关注意事项的详解
2013/06/03 PHP
实例介绍PHP的Reflection反射机制
2014/08/05 PHP
Docker搭建自己的PHP开发环境
2018/02/24 PHP
Thinkphp框架+Layui实现图片/文件上传功能分析
2020/02/07 PHP
node.js中的path.basename方法使用说明
2014/12/09 Javascript
javascript 对象数组根据对象object key的值排序
2015/03/09 Javascript
跟我学习javascript的prototype原型和原型链
2015/11/18 Javascript
JavaScript+html5 canvas绘制缤纷多彩的三角形效果完整实例
2016/01/26 Javascript
JavaScript中的boolean布尔值使用学习及相关技巧讲解
2016/05/26 Javascript
浅谈js常用内置方法和对象
2016/09/24 Javascript
利用jQuery对无序列表排序的简单方法
2016/10/16 Javascript
Node.js发送HTTP客户端请求并显示响应结果的方法示例
2017/04/12 Javascript
详解vue-router2.0动态路由获取参数
2017/06/14 Javascript
jQuery实现轮播图及其原理详解
2020/04/12 jQuery
在Web关闭页面时发送Ajax请求的实现方法
2019/03/07 Javascript
js回文数的4种判断方法示例
2019/06/04 Javascript
Vue的Eslint配置文件eslintrc.js说明与规则介绍
2020/02/03 Javascript
vue实现点击按钮“查看详情”弹窗展示详情列表操作
2020/09/09 Javascript
如何通过JS实现日历简单算法
2020/10/14 Javascript
[30:00]完美世界DOTA2联赛PWL S2 Rebirth vs LBZS 第二场 11.28
2020/12/01 DOTA
python 数据加密代码
2008/12/24 Python
Python创建系统目录的方法
2015/03/11 Python
使用Python中PDB模块中的命令来调试Python代码的教程
2015/03/30 Python
Python xlrd读取excel日期类型的2种方法
2015/04/28 Python
Django Form 实时从数据库中获取数据的操作方法
2019/07/25 Python
Python中最好用的命令行参数解析工具(argparse)
2019/08/23 Python
基于python plotly交互式图表大全
2019/12/07 Python
基于python3抓取pinpoint应用信息入库
2020/01/08 Python
Java方面的关于数组和继承的笔面试题
2015/09/18 面试题
葡萄牙语专业个人求职信
2013/12/10 职场文书
陈欧的广告词
2014/03/18 职场文书
党的群众路线学习笔记
2014/11/06 职场文书
毕业感言怎么写
2015/07/31 职场文书
八年级语文教学反思
2016/03/03 职场文书
浅析Django接口版本控制
2021/06/26 Python