如何自定义 CheckboxSelectMultiple 小部件通过 crispyforms 呈现的方式？

Question

我有一个 Django ModelForm，它使用 CheckboxSelectMultiple 小部件呈现 ForeignKey 字段。我希望能够通过添加 and/or 删除一些 css 类.

来更改复选框的显示

在模板中，表单呈现如下：

<div id="id_activities" class="form-group">
    <label class="" for"">Choose Activities:</label>
    <div class="">
        <div class="custom-control custom-checkbox">
            <input id="id_activities_1" class="custom-control-input" type="checkbox" name="activities" value="1"/>
            <label class="custom-control-label" for="id_activities_1">..</label>
        </div>
    </div>
</div>

我希望能够使用一些非 bootstrap 类 自定义复选框的外观。我试过提供具有以下内容的模板 html:

{% load crispy_forms_field %}

<div class="form-group">
    <label class="" for="">Choose Activities</label>
    <div>
        <div class="custom-control custom-checkbox addon">
            {% crispy_field field 'class' 'custom-control-input' %}
             <label class="custom-control-label small" for="{{ field.id_for_label }}">{{ field.label }}</label>
        </div>
    </div>
</div>

但这会导致输入被包裹在

我目前正在尝试覆盖我自己的 scss 文件中的 bootstrap 类，但对这种解决方法感到不满意，因为我想要更多的控制权。是否有更好的自定义 CheckboxSelectMultiple 的方法？我是否需要创建自定义布局对象？

Answer 1

为了解决这个问题，我对 CheckboxSelectMultiple 小部件进行了子类化，并为 tempate_name 和 option_template_name 提供了我自己的模板。我主要重用了 django 模板代码，但将列表元素交换为 divs