django - 无法使用 django-crispy 表单在同一行显示标签和字段

Question

我试图将字段标签放在表单的左侧，右侧有文本输入。但是，我似乎无法让它发挥作用。这是我放置的设置。

表单.py

helper = FormHelper()
helper.form_class = 'form-horizontal'
helper.layout = Layout(
    Field('test_field'),
    FormActions(
        Submit('submit', 'Record', css_class='btn btn-primary'),
        Reset('reset', 'Clear', css_class='btn btn-default'),
    )
)

表单.html

{% extends 'base.html' %}
{% load crispy_forms_tags %}

{% block page_panel %}
{% crispy form %}
{% endblock %}

生成的html是这样的 result

Answer 1

在您的示例中，您尝试实现 Bootstrap form-horizontal 。要正确执行此操作，您需要将辅助类添加到标签和表单输入 per the docs 。

试试这个让 form-horizo​​ntal 工作，例如:

helper = FormHelper()
helper.form_class = 'form-horizontal'
helper.label_class = 'col-lg-2'
helper.field_class = 'col-lg-8'
helper.layout = Layout(
    Field('test_field'),
    FormActions(
        Submit('submit', 'Record', css_class='btn btn-primary'),
        Reset('reset', 'Clear', css_class='btn btn-default'),
    )
)

您可以根据需要调整列大小。

另一种稍微不同的布局选项(标签也与输入处于同一级别而不是其上方)是使用 Bootstrap 的 form-inline这需要 different config using Django crispy forms .