》完成基本的结构
<!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值,就可以去查找这个城市对应的子级城市了
前端再发请求 配置路由 城市视图结果
》后面的流程就和省级是一样的了
复习列表生成式 城市视图完成