Django Admin 默认不支持多级联动下拉，因其 ForeignKey 下拉为静态加载且无响应式数据流；需通过自定义 ModelAdmin、后端 JSON API、正确 JS 绑定及表单校验协同实现。
为什么 Django Admin 默认不支持多级联动下拉
Django Admin 的 ForeignKey 字段渲染为下拉菜单时，是静态加载全部关联对象的——它不会感知前端选择变化、也不会自动触发二次请求。所谓“省→市→区”三级联动，在 Admin 原生机制里根本不存在响应式数据流。你看到的“联动失效”，不是配置错了，而是它压根没这个设计。
常见错误现象包括：ReferenceError: django.jQuery is not defined（jQuery 加载顺序错）、下拉选项始终为空、选中一级后二级无反应、保存时报 ValueError: Cannot assign "<province:>": "City.province" must be a "Province" instance</province:>（后端没做数据校验或表单覆盖不完整）。
用自定义 ModelAdmin + JavaScript 实现联动逻辑
核心思路：保留原生字段结构，但用 JS 拦截 DOM 变化，动态替换下拉选项；后端提供简单 API 返回子集数据。关键点不在“怎么写 JS”，而在“怎么让 JS 和 Admin 表单生命周期对齐”。
- 在
ModelAdmin的get_urls()中添加一条路由，例如^admin/city/json/，返回province_id对应的City列表（JSON 格式，字段含id和name） - 重写
Media类，引入自定义 JS 文件（注意：必须放在django.jQuery之后，否则django.jQuery(document).ready不生效） - JS 中监听一级下拉的
change事件，清空并禁用二级下拉，发起 AJAX 请求；成功后填充<option>，并恢复启用 - 务必在 JS 中处理空值情况（如用户手动删掉一级选项后，二级应清空且设为 disabled）
示例片段（后端 API 视图）：
图片提示词生成器？不止如此。 马甲系统 —— 把脑海中的画面，翻译成AI能理解的专业表达。 用得越多，它越懂你：首次需要多问几句确认方向，用久了几乎一说就懂。 用得越多，它越快：缓存机制让后续对话越来越省。 RAG进化：成功案例持续入库，越跑越聪明。 输入「新手指南」查看完整功能介绍
立即学习“Python免费学习笔记（深入）”；
def city_json_view(request):
province_id = request.GET.get('province_id')
cities = City.objects.filter(province_id=province_id).values('id', 'name')
return JsonResponse(list(cities), safe=False)
避免表单提交时因 JS 动态选项导致验证失败
Admin 表单提交前会校验字段值是否属于合法外键范围。如果你只靠 JS 替换 <select> 的 <option>，而没同步更新 Django 表单的 choices，就会触发 InvalidChoice 错误。这不是前端问题，是后端表单契约被破坏了。
- 不要在
ModelForm的__init__中硬编码choices（会导致所有实例共享同一份选项） - 正确做法：继承
ModelChoiceField，重写to_python(self, value)，允许传入None或有效 ID；同时在clean_<field_name>方法中做存在性检查（比如查一遍City.objects.filter(id=value, province=xxx)） - 如果使用
raw_id_fields或autocomplete_fields，联动逻辑需改用search_fields+ 自定义get_search_results，而非下拉菜单
移动端和筛选器场景下的兼容性陷阱
Admin 的筛选器（list_filter）和移动端折叠面板会复用相同字段的渲染逻辑，但你的联动 JS 很可能只绑定了主表单区域的 DOM。结果就是：在列表页点击筛选器里的省下拉，市下拉完全没反应；或者在小屏上展开编辑弹窗时，JS 找不到目标元素。
- 用委托事件代替直接绑定：
django.jQuery(document).on('change', '#id_province', ...)，确保动态插入的 DOM 也能响应 - 检查选择器是否带命名空间：
#id_province在内联编辑（InlineModelAdmin）中会变成#id_form-0-province，需用属性选择器匹配[id$="-province"] - 避免依赖固定 ID；优先用
data-field-type="province"这类自定义属性定位，更稳定
真正麻烦的从来不是“怎么让三个下拉动起来”，而是“怎么让它们在所有 Admin 上下文里都动得一致”。JS 只负责呈现，后端校验和表单契约才是防线。漏掉任意一环，上线后就只能靠用户报错来发现。
