目录

一、先看下app文件目录

二、编写models.py样例

三、确定二级数据和js内容

1.编写路由urls.py

2.views传递数据,json格式

3.定制js文件

四、在adminx.py将js文件引入

五、实现效果


我的实现方法与网上大多数稍有不一样,我自己根据网上查到的设置了,但是有会出现失效的情况,还是会混乱。刚开始还能一直使用,后来随着对xadmin的了解,自己有重新修改了相关的代码,改变了js的加载和数据的传递。

一、先看下app文件目录

二、编写models.py样例

from django.db import modelsclass FirstIndicator(models.Model):creat_time = models.DateTimeField(verbose_name='创建时间', auto_now_add=True)update_time = models.DateTimeField(verbose_name='更新时间', auto_now=True)first_indicator = models.CharField(max_length=50, verbose_name='一级指标')state = models.CharField(max_length=5, choices={('yes', "使用"), ('no', "弃用")}, verbose_name='使用状态', default='yes')class Meta:verbose_name = u'一级指标目录'verbose_name_plural = verbose_namedef __str__(self):return self.first_indicatorclass SecondIndicator(models.Model):creat_time = models.DateTimeField(verbose_name='创建时间', auto_now_add=True)update_time = models.DateTimeField(verbose_name='更新时间', auto_now=True)first_indicator = models.ForeignKey(FirstIndicator, verbose_name='一级指标', on_delete=models.CASCADE)second_indicator = models.CharField(max_length=50, verbose_name='二级指标')score = models.FloatField(verbose_name='分值')state = models.CharField(max_length=5, choices={('yes', "使用"), ('no', "弃用")}, verbose_name='使用状态', default='yes')class Meta:verbose_name = u'二级指标目录'verbose_name_plural = verbose_namedef __str__(self):return self.second_indicatorclass ThirdIndicator(models.Model):creat_time = models.DateTimeField(verbose_name='创建时间', auto_now_add=True)update_time = models.DateTimeField(verbose_name='更新时间', auto_now=True)first_indicator = models.ForeignKey(FirstIndicator, verbose_name='一级指标', on_delete=models.CASCADE)second_indicator = models.ForeignKey(SecondIndicator, verbose_name='二级指标', on_delete=models.CASCADE)third_indicator = models.CharField(max_length=50, verbose_name='三级指标')minus_points = models.FloatField(verbose_name='扣分')state = models.CharField(max_length=5, choices={('yes', "使用"), ('no', "弃用")}, verbose_name='使用状态', default='yes')class Meta:verbose_name = u'三级指标目录'verbose_name_plural = verbose_namedef __str__(self):return self.third_indicatorclass Problem(models.Model):user = models.ForeignKey(UserProfile, verbose_name='上报人', on_delete=models.CASCADE, blank=True)creat_time = models.DateTimeField(verbose_name='创建时间', auto_now_add=True)update_time = models.DateTimeField(verbose_name='更新时间', auto_now=True)first_indicator = models.ForeignKey(FirstIndicator, verbose_name='一级指标', on_delete=models.CASCADE)second_indicator = models.ForeignKey(SecondIndicator, verbose_name='二级指标', on_delete=models.CASCADE)third_indicator = models.ForeignKey(ThirdIndicator, verbose_name='三级指标', on_delete=models.CASCADE)countryside_name = models.ForeignKey(CountrySidename, verbose_name='村名称', on_delete=models.CASCADE)state = models.CharField(max_length=5, choices={('yes', "存在问题"), ('no', "已不存在")}, verbose_name='问题状态', default='yes')position = models.CharField(max_length=50, verbose_name='位置')# longitude = models.CharField(max_length=50, verbose_name='经度')# latitude = models.CharField(max_length=50, verbose_name='纬度')class Meta:verbose_name = u'检查问题'verbose_name_plural = verbose_namedef __str__(self):return str(self.id)

三、确定二级数据和js内容

1.编写路由urls.py

#项目总路由 urls
from django.urls import path,include,re_path
import xadminurlpatterns = [path('xadmin/', xadmin.site.urls),# xadmin二级菜单(农村垃圾分类一级二级三级)re_path(r'countryside/', include('countryside.urls')),
}#app的urlsfrom django.urls import path
from .views import get_indicator
urlpatterns = [path('get_indicator/', get_indicator),
]

2.views传递数据,json格式

#views.pyfrom django.core import serializers
from django.http import HttpResponse
from django.shortcuts import render# Create your views here.
from .models import SecondIndicator, ThirdIndicator# 获取二级指标
def get_indicator(request):"""二级指标"""print('二级数据')first_indicator = request.GET.get('first_indicator')# 公司当前二级岗位if first_indicator:second_indicator = SecondIndicator.objects.filter(first_indicator_id=first_indicator, state='yes')print(second_indicator)result = serializers.serialize("json", second_indicator)print(result)return HttpResponse(result)print('三级数据')second_indicator = request.GET.get('second_indicator')# 正在招聘二级岗位if second_indicator:third_indicator = ThirdIndicator.objects.filter(second_indicator_id=second_indicator, state='yes')print('二级')print(third_indicator)result = serializers.serialize("json", third_indicator)print(result)return HttpResponse(result)

3.定制js文件

#js文件$("#id_first_indicator").change(function () {let first_indicator =  $("#id_first_indicator").val();$('#id_second_indicator')[0].selectize.clearOptions();// 清空子级$.ajax({url: '/countryside/get_indicator/?first_indicator=' + first_indicator, // 根据自己需要进行填写地址type: 'get',contentType: "application/json;charset=utf-8",dataType: 'json',async: true,beforeSend: function (xhr, settings) {xhr.setRequestHeader('X-CSRFToken', '{{ csrf_token }}')},success: function (data) {for (var i = 0; i < data.length; i++) {var test = {text: data[i].fields.second_indicator, value: data[i].pk, $order: i + 1}; //遍历数据,拼凑出selectize需要的格式console.log(test);$('#id_second_indicator')[0].selectize.addOption(test); //添加数据}},error: function (msg) {}})
});$("#id_second_indicator").change(function () {let second_indicator =  $("#id_second_indicator").val();$('#id_third_indicator')[0].selectize.clearOptions();// 清空子级$.ajax({url: '/countryside/get_indicator/?second_indicator=' + second_indicator, // 根据自己需要进行填写地址type: 'get',contentType: "application/json;charset=utf-8",dataType: 'json',async: true,beforeSend: function (xhr, settings) {xhr.setRequestHeader('X-CSRFToken', '{{ csrf_token }}')},success: function (data) {for (var i = 0; i < data.length; i++) {var test = {text: data[i].fields.third_indicator, value: data[i].pk, $order: i + 1}; //遍历数据,拼凑出selectize需要的格式console.log(test);$('#id_third_indicator')[0].selectize.addOption(test); //添加数据}},error: function (msg) {}})
});

四、在adminx.py将js文件引入

import xadmin
from .models import FirstIndicator,SecondIndicator, ThirdIndicator, Problemclass FirstIndicatorAdmin(object):list_display = ['id', 'first_indicator', 'state', 'creat_time', 'update_time']list_per_page = 10search_fields = ['creat_time']class SecondIndicatorAdmin(object):list_display = ['id', 'first_indicator', 'second_indicator', 'score', 'state', 'creat_time', 'update_time']list_per_page = 10class ThirdIndicatorAdmin(object):list_display = ['id', 'first_indicator', 'second_indicator', 'third_indicator', 'minus_points', 'state','creat_time', 'update_time']list_per_page = 10search_fields = ['creat_time']class ProblemAdmin(object):list_display = ['id', 'creat_time', 'user', 'countryside_name', 'first_indicator', 'second_indicator', 'third_indicator','position', 'upload_img' ,'state',]list_per_page = 10search_fields = ['creat_time']def get_media(self):"""继承js并且添加我们的js文件"""media = super(ProblemAdmin, self).get_media() + self.vendor('xadmin.page.form.js')media += self.vendor('xadmin.widget.countryside.js', 'xadmin.form.css')#以下是我测试的type类型,可以拼接# media1 = Media(js=['xadmin/js/countryside.js',])# media += media1# print(type(media))# print("#### MEDIA IS {}".format(media))return media

五、实现效果

xadmin后台实现二级和三级联动下拉

参考链接:

  1. xadmin之后台管理下拉列表实现二级联动_阿巍的笔记簿-CSDN博客
  2. 关于django2.0+Xadmin 后台页面多级联动的尝试_熊人族永不为奴的博客-CSDN博客
  3. django xadmin后台页面实现二级联动 - 曹婷婷 - 博客园
  4. Django实现标签联动以及xadmin中实现标签联动_time-CSDN博客_django 联动

Django实现xadmin后台二级联动、三级联动(提供另一种实现方式)相关推荐

  1. 二级联动 三级联动 多级联动 无限级联动下拉列表或菜单专题

    二级联动 三级联动 多级联动 无限级联动下拉列表或菜单专题 三维数组数据源   A - 请选择 -北京市天津市河北省山西省内蒙古自治区辽宁省吉林省黑龙江省上海市江苏省浙江省安徽省福建省江西省山东省河南 ...

  2. Django中提供的6种缓存方式

    由于Django是动态网站,所有每次请求均会去数据进行相应的操作,当程序访问量大时,耗时必然会更加明显,最简单解决方式是使用: 缓存,缓存将一个某个views的返回值保存至内存或者memcache中, ...

  3. Django配置xadmin后台模板之坑(一)

    环境: Python3.6 + Django2.0 + xadmin2.0 一.安装 1.首先安装就会有一个坑,很多教程的安装是直接在虚拟环境下使用 pip install xadmin 或者 pip ...

  4. Django中提供了6种缓存方式

    开发调试 内存 文件 数据库 Memcache缓存(python-memcached模块) Memcache缓存(pylibmc模块) 1. 开发调试 1 2 3 4 5 6 7 8 9 10 11 ...

  5. Django 省、市、区 三级联动 及数据库的地址添加 !!!

    应用场景 `淘宝`.`京东`等需要地址的地方 Models.py模型 from django.db import models# Create your models here. class Area ...

  6. Django扩展xadmin后台管理

    python:3.7.2 django:2.1.2 githup:https://github.com/sshwsfc/xadmin 安装xadmin django版本2.0及以上一不能使用pip i ...

  7. element级联选择器城市3级联动三级联动json数据

    [{"value": "110000","label": "北京市","children": [{& ...

  8. Django中提供了6种缓存方式,你会几种?

    开发调试 内存 文件 数据库 Memcache缓存(python-memcached模块) Memcache缓存(pylibmc模块) 1. 开发调试 # 此为开始调试用,实际内部不做任何操作# 配置 ...

  9. 极光推送经验之谈-Java后台服务器实现极光推送的两种实现方式

    转载自 https://www.cnblogs.com/V1haoge/p/6439313.html 原创作品,可以转载,但是请标注出处地址http://www.cnblogs.com/V1haoge ...

最新文章

  1. 【CTF】实验吧 凯撒变异
  2. 城市大脑与智慧城市前沿趋势 主题论坛 |未来科技大讲堂 第12期
  3. laravel 发送带附件的邮件
  4. mysql 数据索引使用_mysql数据库正确建立索引及使用
  5. Vue常用指令v-show
  6. 关于python的打包打包完生成exe文件之后,不能正常执行程序的问题解决。
  7. 灯泡亮度控制单片机_如何延长投影机灯泡使用寿命 延长投影机灯泡使用寿命方法【介绍】...
  8. HTML基础之CSS
  9. 1451 - Average 高速求平均值
  10. 一个c++程序员一年前的生活笔记
  11. [USACO17FEB] Why Did the Cow Cross the Road I P (树状数组求逆序对 易错题)
  12. 今日七夕!不取标题,只想娶你
  13. SFB 项目经验-45-用培训课件当运维文档,聪明
  14. 【Android小应用】强迫症头像生成器
  15. 面向对象与面向过程对比
  16. Caffe ImageNet例程翻译
  17. Linux fork函数
  18. JAVA基础算法(6)----- 国际象棋 α 皇后问题
  19. 如何获取到电脑所连接Wifi的密码
  20. 关于 负反馈放大电路,你需要了解这些

热门文章

  1. 国家开放大学 《数据库应用技术》形考任务11数据库题
  2. Redisson分布式锁简单应用
  3. 51单片机电子钟 是如何做成的(2)---分析例程结构
  4. Unity 开源示例合集
  5. Oracle Spacial(空间数据库)创建空间字段示例
  6. XCZU15EG学习资料保存第527篇:基于3U VPX XCZU15EG+TMS320C6678的信号处理板
  7. 产业分析:内容机构(MCN)行业
  8. python串口通信 - serial
  9. spark sql读取sql server报错:com.microsoft.sqlserver.jdbc.SQLServerException: Invalid object name ‘dbo.st
  10. SPSS中,进行配对样本T检验