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取代netcat过程分析
Feb 10 Python
Python 删除整个文本中的空格,并实现按行显示
Jul 24 Python
django框架自定义用户表操作示例
Aug 07 Python
Python3最长回文子串算法示例
Mar 04 Python
python常用排序算法的实现代码
Nov 08 Python
pyecharts动态轨迹图的实现示例
Apr 17 Python
Tensorflow实现将标签变为one-hot形式
May 22 Python
Keras预训练的ImageNet模型实现分类操作
Jul 07 Python
python如何将图片转换素描画
Sep 08 Python
Python爬虫之Selenium实现键盘事件
Dec 04 Python
python b站视频下载的五种版本
May 27 Python
Python合并多张图片成PDF
Jun 09 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查询ip所在地的方法
2014/12/05 PHP
php文件系统处理方法小结
2016/05/23 PHP
PHP7新特性foreach 修改示例介绍
2016/08/26 PHP
破解Session cookie的方法
2006/07/28 Javascript
js 无提示关闭浏览器页面的代码
2010/03/09 Javascript
使用JQuery和CSS模拟超链接的用户单击事件的实现代码
2012/05/23 Javascript
浅谈Javascript Base64 加密解密
2014/12/28 Javascript
javascript常用方法总结
2015/05/14 Javascript
JavaScript中的原型prototype属性使用详解
2015/06/05 Javascript
coffeescript使用的方式汇总
2015/08/05 Javascript
js和jQuery设置Opacity半透明 兼容IE6
2016/05/24 Javascript
json对象与数组以及转换成js对象的简单实现方法
2016/06/24 Javascript
jQuery插件DataTables分页开发心得体会
2017/08/22 jQuery
Async/Await替代Promise的6个理由
2019/06/15 Javascript
小程序的上传文件接口的注意要点解析
2019/09/17 Javascript
VUE中使用HTTP库Axios方法详解
2020/02/05 Javascript
[01:50]WODOTA制作 DOTA2中文宣传片《HERO》
2013/04/28 DOTA
Python实现的Excel文件读写类
2015/07/30 Python
利用matplotlib+numpy绘制多种绘图的方法实例
2017/05/03 Python
浅谈python中列表、字符串、字典的常用操作
2017/09/19 Python
人工智能最火编程语言 Python大战Java!
2017/11/13 Python
解决Python的str强转int时遇到的问题
2018/04/09 Python
Python实现数据可视化看如何监控你的爬虫状态【推荐】
2018/08/10 Python
python修改FTP服务器上的文件名
2019/09/11 Python
python Manager 之dict KeyError问题的解决
2019/12/21 Python
python代码如何实现余弦相似性计算
2020/02/09 Python
Python3利用openpyxl读写Excel文件的方法实例
2021/02/03 Python
介绍一下XMLHttpRequest对象
2012/02/12 面试题
路政管理毕业自荐书范文
2014/02/10 职场文书
小学生操行评语大全
2014/04/22 职场文书
2015年世界环境日活动总结
2015/02/11 职场文书
三行辞职书范文
2015/02/26 职场文书
干货:企业内部人才推荐奖励方案!
2019/07/09 职场文书
vue中data改变后让视图同步更新的方法
2021/03/29 Vue.js
Vue接口封装的完整步骤记录
2021/05/14 Vue.js
mysql数据库隔离级别详解
2022/06/16 MySQL