如何在 crispy-form (Django) 的 InlineCheckboxes 中的行与行之间添加空格并对齐元素？

Question

我有一个表单字段 CheckboxSelectMultiple，我使用 crispy-forms 中的 InlineCheckboxes 使所有这些复选框内联。由于我没有它的图像，我将使用代码片段作为示例。

这就是我想要的表单在 html 中的样子，我将使用 stars 而不是框

     *name1    *name2    *name3    *name4
     *name5    *name6    *name7    *name8
     *name9    *name10   *name11   *name13

如何在每行之间添加更多空格并使其像上图所示垂直对齐？

这是我的 forms.py

class AttendanceForm(forms.ModelForm):
    class Meta:
        model = Attendance
        fields = ['student',]
        widgets = {'student': forms.CheckboxSelectMultiple()}

    def __init__(self, class_pk, current_user, *args, **kwargs):
        super(AttendanceForm, self).__init__(*args, **kwargs)
        current_student = Class.objects.get(id=class_pk)
        self.helper = FormHelper(self)
        self.fields['student'].queryset = current_student.student.order_by('first_name')
        self.helper.layout = Layout(
            InlineCheckboxes('student')
        )

我现在的 html。（它没有如上所示完全对齐！）

<form method="POST" class="ml-auto mr-auto">
  {% csrf_token %} 
  <div style="text-align: justify;">{% crispy form form.helper %}</div>
  <button
    type="submit"
    class="btn btn-success btn-sm"
    style="font-size: 15px"
  >
    Check
  </button>
</form>

在此先致谢！

Answer 1

现在我想做的就是让所有元素内联显示，如果多行则为每一行添加空格。所以我不需要为此使用脆皮形式。我从模板和表单 class 中删除所有脆皮表单标签，然后在模板中我需要做的是：

<form method="POST" class="ml-auto mr-auto">
 {% csrf_token %}
 <div class="row mt-2 ml-auto mr-auto">
  {% for form in form.student %}
  <div class="col-md-4">
   <h6 class="ml-2 mt-2" id="info-text">
    {{ form.tag }} {{ form.choice_label }}
   </h6>
  </div>
  {% endfor %}
 </div>
 <button
   type="submit"
   class="btn btn-success btn-sm"
   style="font-size: 15px"
 >
   Check
 </button>
</form>

如何在 crispy-form (Django) 的 InlineCheckboxes 中的行与行之间添加空格并对齐元素？

How to add spaces between lines and align elements in the same column in InlineCheckboxes of crispy-form (Django)?

django

django-crispy-forms