jquery - Django Jquery : based on selection, 显示更多选择选项

Question

用户必须选择车辆类型，然后根据他的选择，他可以选择车辆型号，然后根据该选择，他可以选择查看该型号可用的特定颜色。

每种车辆、型号和颜色都有单独的 django 模型，其中每个车辆实例都有许多模型(多对多字段)，每个模型都有颜色(多对多字段)。

您将如何创建模板以便用户能够动态地执行此操作？我不想被重定向到不同的 View 。我想我需要使用jquery，以便用户可以从下拉框中选择车辆，然后根据他的选择出现另一个下拉框等等。

有什么想法吗？

Answer 1

我的方法是使用ajax动态更改选择框的内容。有很多方法可以实现这一点。这是一个...

• 创建 3 个选择框(车辆、型号、颜色)
• 使用所有空白条目和所有车辆填充第一个条目
• 捕获车辆和模型的 onchange 事件并创建相应的 javascript 函数。

这是vehicleChange函数的sudo代码:

• 清除所有模型选择选项
• 清除所有颜色选择选项
• 使用ajax从服务器获取模型选择选项
• 填充模型选择框。

这是 modelChange 函数的 sudo 代码:

• 清晰的颜色选择选项
• 使用ajax从服务器获取颜色选择选项
• 填充颜色选择框。

所以现在发生的是:

• 由于您使用的是 ajax，您的页面将不会刷新或重定向。
• “型号”和“颜色”的模型尽可能简单

• 您对“型号”和“颜色”的看法变得非常小。一种可能的 View 会产生如下结果:

  红色
  <选项值=“白色”>蓝色
  <选项值=“蓝色”>蓝色

要更改选择框中的选项，您可以使用 jquery 抓取选择框并用 ajax 调用的结果替换 html。