Django Crispy Forms动态添加formset时CSS不匹配及多余form标签问题

使用{% crispy %}模板标签渲染单个表单实例时，Crispy Forms的FormHelper默认会自动生成完整的<form>包裹标签，这就是出现额外form标签的来源。而|crispy模板过滤器不会读取你在FormHelper中自定义的Layout布局配置，只会渲染默认样式的表单字段，因此无法匹配原有样式。

第一步：修改FormHelper配置 #

在RecipeIngredientForm的__init__方法中，新增两个FormHelper属性，关闭自动生成form标签和csrf token的逻辑：

def __init__(self, *args, **kwargs):
    super(RecipeIngredientForm, self).__init__(*args, **kwargs)
    self.helper = FormHelper()
    # 新增以下两行配置
    self.helper.form_tag = False  # 关闭自动生成form标签
    self.helper.disable_csrf = True  # 关闭自动生成csrf输入框，外层表单已全局配置
    # 原有配置保持不变
    self.helper.form_id = 'id-entryform'
    self.helper.form_class = 'form-inline'
    self.helper.layout = Layout(
        Div(
            Div(Field("name", placeholder="Chickpeas"), css_class='col-6 col-lg-4'),
            Div(Field("quantity", placeholder="2 x 400"), css_class='col-6 col-md-4'),
            Div(Field("unit", placeholder="grams"), css_class='col-5 col-md-4'),
            Div(Field("description", placeholder="No added salt tins"), css_class='col-12'),
        css_class="row",
       ),
    )

第二步：保持现有模板配置不变 #

不需要修改模板中原有的{% crispy ingredient %}和{% crispy formset.empty_form %}写法，即可同时满足两个需求：

• 不再生成多余的<form>嵌套标签
• 所有原有表单和动态新增的表单都保留你自定义的Layout布局和CSS样式

内容的提问来源于stack exchange，提问作者Nick