form-horizo​​ntal 不适用于 django-crispy-forms 和 django-registration-redux

Question

免责声明：我是 Django 和 python 的新手。

我正在使用带有 django 注册 redux 的脆皮表单。我已将 form-horizo​​ntal 应用于注册表单的子类，但它不会在与输入字段相同的行上显示标签，如您在此处看到的：http://imgur.com/hdrPei9

我已将表单水平硬编码到模板中的 html 中，这会将表单内容转移到容器外部：http://imgur.com/KQIKQ7Q

我已尝试创建一个名为 supplyhelixRegistrationForm 的子类表单，其中包含标签和字段类清晰的表单文档说包括：（将包含链接但没有足够的声誉）

来自注册 redux 应用程序的 forms.py 的一部分，包括我的修改：

from crispy_forms.helper import FormHelper
from crispy_forms.layout import Layout, Div, Submit, HTML, Button, Row, Field
from crispy_forms.bootstrap import AppendedText, PrependedText, FormActions

User = UserModel()


class RegistrationForm(UserCreationForm):


    required_css_class = 'required'
    email = forms.EmailField(label=_("E-mail"))

    class Meta:
        model = User
        fields = (UsernameField(), "email")



class supplyhelixRegistrationForm(RegistrationForm):

    def __init__(self, *args, **kwargs):
        super(supplyhelixRegistrationForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper()  
        self.helper.form_class = 'form-horizontal'
        self.helper.label_class = 'col-lg-2'
        self.helper.field_class = 'col-lg-8'

然后我修改了注册reduxviews.py指向supplyhelixRegistrationForm：

REGISTRATION_FORM_PATH = getattr(settings, 'REGISTRATION_FORM', 'registration.forms.supplyhelixRegistrationForm')
REGISTRATION_FORM = import_string( REGISTRATION_FORM_PATH )

这是模板：

{% extends "registration/registration_base.html" %}
{% load i18n %}
{% load crispy_forms_tags %}
{% crispy RegistrationForm RegistrationForm.helper %}

{% block title %}{% trans "Register for an account" %}{% endblock %}

{% block content %}


<div class="container  vertical-center">
  <div class="col-sm-6 col-sm-offset-3">
    <div class="panel  formBackground">

      <div class="panel-heading text-center">
        <h2>Transform your supply chain today!</h2>
      </div>
      <div class="panel-body">


        <form  method="post" action="">
           {% csrf_token %}
           {{ form|crispy}}
           <input class="btn btn-lg btn-primary btn-block" type="submit"  value="{% trans 'Register Now' %}" />
        </form>
      </div>
    </div>
  </div>
</div>
{% endblock %}

感谢您提供的任何帮助。提前致谢！

Answer 1

问题是您正在使用清晰的模板呈现表单，但是因为您将其用作模板变量 ({{ some_variable }}) 而不是使用 {% crispy form_name %} 标记，所以 FormHelper 属性没有得到应用正确。

试试这些改变：

1. 将{{ form | crispy }} 替换为{% crispy form %}。
2. 如果您想继续手动渲染<form></form> 标签，请将以下属性添加到FormHelper：

self.helper.form_tag = False

1. 您可能需要删除当前尝试手动创建.form-horizontal 效果的两行：

   self.helper.label_class = 'col-lg-2'

   self.helper.field_class = 'col-lg-8'

...DCF 会自动将 Bootstrap .form-horizontal CSS 类添加到您的表单中，这些可能会干扰这些自动添加。