django-多级联动课堂版0912

最新推荐文章于 2022-10-19 13:13:47 发布
最新推荐文章于 2022-10-19 13:13:47 发布
阅读量277 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ifubing/article/details/100769718
版权

新建模板

》完成基本的结构

<!DOCTYPE html>
<!--作者：pyhui-->
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<select name="pro" id="pro">
    <option value="">-省份-</option>
</select>


<select name="city" id="city">
    <option value="">-城市-</option>
</select>



<select name="area" id="area">
    <option value="">-区域-</option>
</select>

</body>
</html>

导入jquery

》动态的加载静态文件

在这里插入图片描述

下一步，需要测一下，jquery导入成功了没有

需要可以正常访问这个页面

配置路由

在这里插入图片描述

视图

在这里插入图片描述

试试jquery能否生效

测试

在这里插入图片描述

jquery成功加载

-----主逻辑开始----

思考，如何展现所有的省份？

页面加载后，发一个ajax请求

让后端查询有哪些省份

后端提供数据给前端

发ajax拿省数据

》完成格式

在这里插入图片描述

实现 /one/get_pro/ 的回应

》目的是回应前端的请求，给他一个响应

》路由

在这里插入图片描述

》视图逻辑

在这里插入图片描述

》视图的详情

如何拿到所有的省级信息？？

根据数据表的结构，只要pid_id为空，就是省级地名

在这里插入图片描述

》测试视图的回应是否可以送到前端

在这里插入图片描述
在这里插入图片描述

》发送查询的结果，结果失败

在这里插入图片描述

自己处理数据

因为queryset 不是标准数据类型

传送时会有问题

所以，我们要把需要的数据，处理为python标准数据类型

分析了页面

了解了前端的需求

在这里插入图片描述

所以，自己造数据，给前端

》我们数据太多了

[<>,<>,<>]

可以考虑处理为

[(id，name),(),()]

》代码

在这里插入图片描述

在这里插入图片描述

引入JsonResponse

可以帮我们把python转json字符串

在这里插入图片描述

》效果相当于

在这里插入图片描述
把数据处理为json数据，同时再处理为HttpResponse数据

前端收到的效果：

在这里插入图片描述
》数据成功送 到了前端

前端继续

前端目标

塞option

在这里插入图片描述

》有用的数据

在这里插入图片描述

在这里插入图片描述

遍历数组，数据中的成员又是一个数据

》遍历

在这里插入图片描述

》拿id，拿name，拼option标签

目标：

在这里插入图片描述

拼好后的内容

在这里插入图片描述

最终实现

在这里插入图片描述

在这里插入图片描述

下一步，如何实现，点谁取谁的id

给select标签添加一个change事件

事件的匿免函数中

this，就是发生变化的那个option

通过
在这里插入图片描述
可以拿到value值的

有了 value值，就可以去查找这个城市对应的子级城市了

前端再发请求

在这里插入图片描述

配置路由

在这里插入图片描述

城市视图

在这里插入图片描述

结果

在这里插入图片描述

》后面的流程就和省级是一样的了

复习列表生成式

在这里插入图片描述

城市视图完成

在这里插入图片描述

鲸鱼编程pyhui
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Django web开发中的二级联动select 列表的简单实现方法
心如海的博客
09-25 4677
因给单位行行政部门开发一个《文具管理系统》需要在管理端的入库和员工的领用端实现按文具分类查找出相应的文具，在页面上放了二个select, 第一个select 列出文具分类， 第二个select根据第一个select的分类列出相应的文具。 一， models.py class stat_type(models.Model): name = models.CharField(max_l...
Django自关联实现多级联动查询实例
09-16
主要介绍了Django自关联实现多级联动查询实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
python自关联_Django自关联实现多级联动查询实例
weixin_39957934的博客
12-08 677
1 问题引出我们在开发网站的时候可能会遇到这种情况，多个字段之间有一定的关联性，比如省市县，选择省，之后下一个选择框的值则为该省的市集合，选择市之后下一个选择框的值为该市的县集合。一种实现方式是，建立三个模型表，用外键一对多方式，显然这样是不太合理的。Django提供了自关联的实现，模型自身关联，即一条数据关联另一条数据。本文以省市县为案例介绍其具体实现方法。2 具体实现2.1 建立数据表Mode...
djangoadmin后台表单改造，多个选项多级联动
qq_34917272的博客
10-19 1234
问题 项目admin后台有个选择，choice用list或者枚举类实现，但是无法联动选择，查了很多资料都没法实现。 解决办法 models里面 class Article(models.Model): name = models.CharField('标题', max_length=256) country = models.CharField('国家', max_length=256) province = models.CharField('省份', max_length=2
django-多级联动-前端效果
pyhui的技术博客
09-12 1902
小结 页面的路由 页面的视图 模板页样式 数据库里的内容 内容都是随机出来的 省份的外键值为空 其它情况一样 核对一下模型类 class City(models.Model): name = models.CharField(verbose_name="地名", max_length=20) pid = models.ForeignKey("self", on_delet...
django-rest-captcha
05-27
Django Rest验证码django-simple-captcha轻量级版本，可与django-rest-framework 。特征速度：使用cache代替数据库安全性：用于生成密钥和图像的联合方法。 （一个键不能生成很多图像） 简单：只需一个rest api...
django-rest-framework-role-filters：django-rest-framework的简单角色过滤
02-05
django-rest-framework-role-filters：django-rest-framework的简单角色过滤
django-db-connection-pool:Django 的持久数据库连接后端
05-30
django-db-connection-pool Django 的 MySQL & Oracle & PostgreSQL 连接池后端，基于 SQLAlchemy。快速开始使用pip安装所有引擎： $ pip install django-db-connection-pool[all] 或选择特定引擎： $ pip install ...
django-vue-admin:基于RBAC模型的权限控制的一整套基础开发平台，前拆分分离，采用django + django-rest-framework，前端采用ruoyi-ui + vue + ElementUI
03-07
QQ群QQ群号：812482043由于项目正在启步阶段，第一版预计3月底发，后序会慢慢维护其他版本，有什么不到位的请大家担待〜原始地址gitee地址： ://gitee.com/liqianglog/django-vue-admin github地址： : 内置功能用户...
python django mysql web页面多级联动_python测试开发django-57.xadmin选项二级联动
weixin_32803963的博客
02-09 268
前言当我们选择项目分类的时候，一个项目下关联多个模块，同时有这两个选项框的时候，需要实现选中一个项目，模块里面自动删除出该项目下的模块，如下图这种 解决基本思路： 1.写个jqeury脚本监听change事件 2.ajax发个请求给后端，用views试图函数实现筛选，回传到页面上 3.xadmin加载js脚本ajax请求关于moles相关的内容就不重复写了，打开后台页面，查看select标签的id...
Django Admin实现三级联动的示例代码(省市区)
09-20
多级菜单在很多上面都有应用，这篇文章主要介绍了Django Admin实现三级联动(省市区)，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
django-menu:简单的Django网站导航系统
03-11
Django菜单 由Ross Poulton构建的Django的BSD许可菜单工具< > django-menu提供了一个基本结构，可为您的网站构建多个导航菜单，例如标题菜单栏。 工作人员可以使用Django管理轻松维护这些菜单，而无需任何HTML或Django内部知识。 子菜单也可以仅针对特定URI轻松构建和显示。 安装与配置： pip install django-menu 将menu添加到您的INSTALLED_APPS ./manage.py migrate menu （如果不使用South， ./manage.py syncdb 。应该使用South。） 将django.template.context_processors.request添加到您的TEMPLATE设置中。 以下是适用于大多数小型项目的相当安全的TEMPLATES设置，但是您的设置可能有所不同。
django实现省市县级联菜单
08-10
利用django实现了省市县的级联下拉。数据库采用的是sqlite。
Django省市区三级联动
老师好，我是安同学
08-01 1308
1、模型创建（models.py） 自关联，获取下级的名称为next from django.db import models class Area(models.Model): """ 区域表 """ name = models.CharField(max_length=100, verbose_name='名称') parent = models.ForeignKey('self',on_delete=models.SET_NULL,related_na
python django mysql web页面多级联动_django admin 后台实现三级联动的示例代码
weixin_39711867的博客
12-10 235
在刚进公司的时候，要写一个需求，使用django的admin站点管理，实现一个二级联动的功能，因为要用到django自带的页面，因为不是自定义的，不能直接添加js代码。根据我自己的研究简单的记录一下大概步骤。项目创建流程略过，这里使用MySQL数据库和py3为例。示例项目大概功能，添加一个人物信息，地区通过三级联动选择。一、项目创建成功后，首先写模型类代码：class AreaInfo(model...
关于django2.0+Xadmin 后台页面多级联动的尝试
qq_16102629的博客
07-24 5652
小弟第一次发帖，有什么不对的，请各位大大海涵。问题：如何实现django2.0+Xadmin 后台页面的多级联动（本例为二级联动） 简单说一下自己的思路 先找到控件id ，这样就可以监听change事件 然后把自己写的js加入xadmin中 添加url和view,接受ajax请求和发送数据 第一步：找到联动的上下级select 的 id id就在页面里F12就可以查看，我直接贴上了 父级I...
DJANGO实现下拉框的二级联动
热门推荐
lsysafe的博客
10-14 3万+
环境：PYTHON2.7+DJANGO1.9 有数据表如下，就是想在每次下拉框选择dnsname字段的时候，带出对应的hostipaddr字段 实现如下 models.py from __future__ import unicode_literals from django.db import models class systeminfo(models.Model): ...
在Django下使用Jquery ajax实现select表单的二级联动
svgbdbdbd的专栏
01-12 7055
在Django下使用Jquery ajax实现select表单的二级联动 采用Django+Jquery实现： 网上也看到很多例子，综合很多例子，经过尝试，实现一个简单的省市二级联动，记下来，以免忘记，有考虑不严谨的地方还请大家指正：首先是模型设计（数据库设计）：# coding:utf-8 from django.db import models# Create your models her
django admin 后台实现三级联动
df_1818的博客
04-27 9807
在刚进公司的时候，要写一个需求，使用django的admin站点管理，实现一个二级联动的功能，因为要用到django自带的页面，因为不是自定义的，不能直接添加js代码。根据我自己的研究简单的记录一下大概步骤。 项目创建流程略过，这里使用MySQL数据库和py3为例。 示例项目大概功能，添加一个人物信息，地区通过三级联动选择。 一、项目创建成功后，首先写模型类代码： class AreaInfo(m...
django-q2 与 django-celery
最新发布
06-06
django-q2 和 django-celery 都是 Django 中用于处理异步任务的库，但是它们的实现方式略有不同。 django-celery 是一个基于 Celery 的 Django 应用程序，它使用消息代理（如 RabbitMQ、Redis 等）来分发任务。它...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

鲸鱼编程pyhui

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值