django 表单字段显示乱序答案

【问题标题】：django form field displayed out of orderdjango 表单字段显示乱序
【发布时间】：2022-07-07 23:43:02
【问题描述】：

我有一个小组的表格和模型：

class GroupForm(forms.ModelForm):
    class Meta:
        model = Group
        fields = ('leader', 'description', 'size', 'max_size', 'motto')

        widgets = {
            'size': forms.CheckboxInput(attrs={'id': 'size'}),
            'max_size': forms.TextInput(attrs={'type': 'hidden', 'id': 'maxSize'}),
        }

该组的创建者可以选择检查size 的“是”，然后我使用javascript 将max_size 的类型更改为show。

在我的create_group.html 模板中：

<script>
    let size = document.getElementById('size')
    let maxSize = document.getElementById('maxSize')
    let checked = false
    
    size.onclick = () => {
        checked = !checked
        if (checked === true) {
            maxSize.type = 'show'
        } else {
            maxSize.type = 'hidden'
        }
        
    }
</script>

现在，这工作正常，唯一的问题是字段显示无序。

当页面加载时，max_size 为false，并且其字段不显示。哪个好。但是，当用户检查该组的大小，并且随后max_size 显示为show 时，该字段显示在座右铭字段之后，并且根据fields = ('leader', 'description', 'size', 'max_size', 'motto') 以不正确的顺序显示。

此外，max_size 字段包含在 motto 元素本身中，而不是作为其自己的字段：

对比其他字段都在自己的<p></p>中。

【问题讨论】：

标签： django django-models django-forms django-templates

【解决方案1】：

我猜{{form.as_p}} 等会先渲染所有可见字段，然后再渲染隐藏字段。

您可以在模板中按照您想要的顺序显式呈现字段。与其在模板中硬编码顺序，不如这样（我从未尝试过）：

FIELD_ORDER = ( ('leader', 'description', 'size', 'max_size', 'motto')
class GroupForm(forms.ModelForm):
    class Meta:
        model = Group
        fields = FIELD_ORDER

按照您想要的顺序将字段列表显式传递给您的模板：

fields_in_order = [ form[x] for x in FIELD_ORDER ]

在模板中

{% for field in fields_in_order %}
   {{field}}
{% endfor %}

或者，你可以让这个字段的隐藏由 JS 完成

【讨论】：

字段的隐藏已经通过JS完成了。
还有你所说的“传递给你的模板......”是什么意思，比如，这条线在哪里： fields_in_order = [ form[x] for x in FIELD_ORDER ]

【解决方案2】：

如果其他人遇到这个问题，也可以只使用 js 和 css。现在，我正在使用 javascript 来查看 size 是否被选中，如果是 maxSize.style.display = 'block' 与 maxSize.style.display = 'none' 如果 size 未被选中。

然后我遇到了 django 的表单标签仍然可见的问题。为了解决这个问题，我在 dev.to 上看到了一个答案，您可以自己查看。

我现在的问题是我不知道如何添加仅在表单字段可见时才可见的标签。

【讨论】：