如何在Django中设置formset样式使其继承主表单的样式

DevOps 小满

2026-9-26

问题原因

你创建formset时使用的ParteForm类没有配置任何带样式的widget属性，所有bootstrap相关的class、js事件配置都写在了PresupuestosParteForm类中，二者没有关联，所以formset渲染出来的字段自然没有对应样式。

修复步骤

替换Presupuestos/forms.py中的formset定义，将绑定的表单类替换为带样式配置的PresupuestosParteForm，同时指定和原ParteForm一致的字段避免冗余：

# 替换原有的 ParteFormSet = formset_factory(ParteForm, extra=1)
ParteFormSet = formset_factory(
    PresupuestosParteForm, 
    extra=1, 
    # 指定和原ParteForm一致的字段，排除不需要的descuento、total字段
    fields=['codigo','descripcion','quantity','unit_price','total_price','tax_free']
)

如果你的ParteForm没有其他场景单独使用，也可以直接把PresupuestosParteForm里的widget配置直接挪到ParteForm的Meta类中，效果是一样的。
2. 修复模板中formset的渲染结构错误：你当前把所有formset的表单都放在了同一个<tr>标签内，会导致多个表单的字段挤在同一行显示异常，修改模板中的对应部分：

<!-- 替换原来的formset渲染代码 -->
{{ formset.management_form }}
{% for form in formset %}
<tr>
    <td>
        <div>{{ form.codigo }}</div>
    </td>
    <td>
        <div>{{ form.descripcion }}</div>
    </td>
    <td>
        <div>{{ form.quantity }}</div>
    </td>
    <td>
        <div>{{ form.unit_price }}</div>
    </td>
    <td>
        <div>{{ form.total_price }}</div>
    </td>
    <td>
        <div>{{ form.tax_free }}</div>
    </td>
    <td></td>
</tr>
{% endfor %}