Question

我试图将我的字段标签放在表单的左侧，右侧有文本输入。但是，我似乎无法使其发挥作用。以下是我已经放置的设置。

forms.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'),
    )
)

form.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-horizontal正常工作，例如：

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。

Answer 2

在将以下内容添加到 settings.py 之前，我也无法使其正常工作：

CRISPY_TEMPLATE_PACK = 'bootstrap4'

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

2 个答案: