引用 Wagtail Form Builder 生成的表单字段答案

【问题标题】：Referencing forms fields generated with Wagtail Form Builder引用 Wagtail Form Builder 生成的表单字段
【发布时间】：2016-08-31 22:12:01
【问题描述】：

我使用 Wagtail Form Builder 生成了一个包含四个字段的简单联系表单。我面临的挑战是，我无法单独引用带有 css 类的表单字段，因为我不确定应该从哪里获取字段 id 和标签名称。

这是呈现表单的代码：

<h1>{{ page.title }}</h1>
    {{ page.intro|richtext }}

    <form action="{% pageurl page %}" method="POST" class="sky-form contact-style">
        {% csrf_token %}
        {{ form.as_p }}
        <input type="submit">
    </form>

如果无法单独引用字段，还有什么其他方法可以达到相同的结果？

【问题讨论】：

标签： django wagtail

【解决方案1】：

Wagtail formbuilder创建动态表单-每个字段的id（名称）由以下代码创建：str(slugify(text_type(unidecode(self.label))))

（来自https://github.com/torchbox/wagtail/blob/master/wagtail/wagtailforms/models.py#L90）

因此，字段标签被转换为 ascii 字符，然后转换为 slug。例如，如果您有一个字段名称 First Name，它将被转换为 'first-name'。

找出 wagtail formbuilder 创建的表单字段的实际 id 是什么的简单方法是通过枚举它们来实际输出模板中的字段：

{% for field in form %} 
    {{ field }} 
{% endfor %}

然后检查生成的 html 代码以查看其实际 id（您会看到 <input class="textinput textInput" id="id_first-name" maxlength="255" name="first-name" type="text">，因此您会知道该字段的 id 是 first-name）

【讨论】：

谢谢，这个解释有助于理解解包表单的实际工作原理，以及如何引用字段，我的表单现在已经启动并运行了。