python - Django - 如何从下拉列表中的选定值动态显示数据表/行
问题描述
又是我,Django 新手。
我正在尝试通过 html 表从添加 py 表单中从 dropdowm 中选择的值显示相关的行/信息。
例如,我从员工模型中得到了一个表格。我从来自员工模型的 LOV 中选择员工 1。员工 1 是技能模型的 fk。从下拉列表中选择员工 1 后,下面会显示一个表格,列出员工 1 拥有的所有技能,这些技能来自技能模型。
这些是我到目前为止得到的。我在网上找不到任何其他适合此特定要求的有用参考资料,尤其是。到目前为止,我是如何编写和构建我的代码的。我真的迷路了。我真的在树桩上。我不知道从哪里开始以及如何开始。
片段:
employee_form.html
{% extends 'skillsMatrixApp/base.html' %}
{% block title %}Add Employee{% endblock %}
{% block employee_active %}active{% endblock %}
{% block body %}
{% if error_message %}
<p><strong>{{ error_message }}</strong></p>
{% endif %}
<form class="form-horizontal" role="form" action="" method="post" enctype="multipart/form-data">
{% csrf_token %}
{% include 'skillsMatrixApp/form-template.html' %}
<div class="form-group sub">
<div class="col-sm" style="text-align: right">
<button type="submit" formnovalidate class="btn btn-info">Save</button>
<button type="submit" formnovalidate name="another" class="btn btn-info">Save and add another</button>
<button type="submit" formnovalidate name="cancel" class="btn btn-danger">Cancel</button>
</div>
</div>
</form>
{% endblock %}
表单模板.html
<div class="form-tmp ">
{% for field in form %}
<!--<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<span class="text-danger small">{{ field.errors }}</span>
</div>
<label class="control-label col-sm-2">{{ field.label_tag }}</label>
<div class="col-sm-10">{{ field }}</div>
</div>-->
<div class="form-lbl"> {{ field.label_tag }} {{ field }}
<div class="error">{{ field.errors }}
</div>
</div>
{% endfor %}
</div>
视图.py
class skillsMatrixCreate(SuccessMessageMixin, CreateView):
model = skillsMatrix
fields = ['skillsMatrixEmployee', 'skillsMatrixSkills', 'proficiency', 'levelOfInterest']
success_url = reverse_lazy('skillsMatrixApp:skills-matrix')
success_message = "Skill associated to Employee successfully."
def post(self, request, *args, **kwargs):
if "cancel" in request.POST:
return HttpResponseRedirect(reverse('skillsMatrixApp:index'))
return super(skillsMatrixCreate, self).post(request, *args, **kwargs)
def get_success_url(self):
if "another" in self.request.POST:
return reverse('skillsMatrixApp:skills-matrix-add')
# else return the default `success_url`
return super(skillsMatrixCreate, self).get_success_url()
网址.py
url(r'skills-matrix/$', views.skillsMatrixView.as_view(), name='skills-matrix'),
url(r'skills-matrix/add/$', views.skillsMatrixCreate.as_view(), name='skills-matrix-add'),
url(r'skills-matrix/(?P<pk>[0-9]+)/$', views.skillsMatrixUpdate.as_view(), name='skills-matrix-update'),
url(r'skills-matrix/(?P<pk>[0-9]+)/delete/$', views.skillsMatrixDelete.as_view(), name='skills-matrix-delete'),
]
请帮忙。
任何帮助、提示和建议都会很棒。谢谢!
解决方案
在网页上动态显示意味着您需要使用 AJAX 调用。只需在下拉列表中放置一个 javascript 侦听器即可捕获所选员工的价值。
<select id="selectXX" onchange="displaySkills(this)">
displaySkills 应该向服务器发送一个 AJAX 请求以检索技能列表并将它们显示在表格或其他内容中。在 django 端创建一个以员工为参数并返回技能列表的函数,最好是 JSON 格式。最后创建一个您将在请求中使用的路由。
推荐阅读
- sass - 如何使 YouTube 缩略图图像纵横比为 21:9
- ios - 标签栏控制器中的图像和标题与 iPhone X 重叠?
- android - 屏幕锁定时Android线程执行减慢
- typescript - 在 VSCode 中自动导入 Typescript 子模块而不是父模块
- java - Android应用程序在单击按钮时崩溃
- eclipse - 检查最近的 -SNAPSHOT 父级
- javascript - 在 Quill js 编辑器中模拟文档页面
- java - Spring Boot:PUT 不更新 ManyToOne 字段,但所有其他字段
- kotlin - 协程的类强制转换异常
- pandas - Python pandas:计算所有列的统计范围。