在 Django 模板中访问 CheckBoxMultiple 选定的项目答案

【问题标题】：Accessing CheckBoxMultiple selected items in Django Template在 Django 模板中访问 CheckBoxMultiple 选定的项目
【发布时间】：2015-03-02 11:43:30
【问题描述】：

我正在尝试用自动完成下拉菜单替换 CheckBoxSelectMultiple 字段。当一个自动完成的项目被选中时，一个隐藏的输入被附加到一个带有所选项目值的 div 中，所以一旦表单被提交，它看起来就像一个复选框字段。

然而，问题是当表单中有错误时恢复这些列表项。理想情况下，我可以创建一个继承自 CheckBoxSelectMultiple 小部件的自定义小部件，但似乎没有任何文档说明如何执行此操作。相反，我认为我可以诉诸类似以下的方法：

{% for box in checkboxes.selected %}
<li>
<span class="selectedItem">
    {{ box.field1 }} ({{box.field2}})
    <input type="hidden" value="{{box.id}}" name="selectedItems"/>
</span>
</li>

{% endfor %}

对于必须相当普遍的问题，这是一个非常老套的解决方案。我想有一种相当优雅的方法可以解决这个问题，我在这里没有看到。 我应该补充一点这也将在一个表单集中进行，所以如果我要修改视图，我需要捕获表单集中每个表单的前缀，因此我为什么要'我避免这样做。

【问题讨论】：

您是否考虑过使用django-autocomplete-light 它几乎可以满足您的所有要求？

标签： jquery html django forms

【解决方案1】：

问题在于您输入的name，因此这里的这一行可能有错误：

<input type="hidden" value="{{box.id}}" name="<<Name of the widget here>>"/>

如果该名称不正确，则 Django 将无法正确获取这些值，这包括任何表单集前缀。

然而，一个更简单的解决方案是按原样呈现 HTML，然后适当地设置它的样式。例如，您可以将实际的复选框置于屏幕外，然后使用颜色突出显示选中的内容和未选中的内容：

input[type="checkbox"] {
  position: absolute;
  left: -9999px;
}
[type="checkbox"]:checked + label {
  color:red;
}
[type="checkbox"]:not(:checked) + label {
  color:blue;
}

【讨论】：