1

我通过扩展WagtailFormBlock下面给出的方法创建了 wagtail FreeForm。我可以使用wagtail admin interface.

文件名:blocks.py

from wagtailformblocks.blocks import WagtailFormBlock

class MyForm(WagtailFormBlock):

    class Meta:
        app_label = 'demo'

这是models.py我在其中创建页面并将表单分配给该页面的文件。

文件名:models.py

from wagtail.wagtailcore.models import Page
from wagtailformblocks.models import BaseForm
from wagtail.wagtailcore.fields import StreamField


class FormType(BaseForm):

    class Meta:
        verbose_name = "Form Type"

class ImagePage(Page):
    template = 'wagtail_demo/image_page.html'

    content = StreamField([
        ('my_forms', MyForm()),
    ])

    content_panels = Page.content_panels + [
        StreamFieldPanel('content'),
    ]

这是我image_page.html要呈现表单字段的页面。

文件名:image_page.html

{% load wagtailcore_tags %}
{% with blocks=self.content %}
    {% for block in blocks %}
        {{ block }}
    {% endfor %}
{% endwith %}

它显示与此页面关联的表单的所有字段。我想单独访问关联表单的每个字段,(e.g.: field name etc.)因为有时我需要使用 javascript 在提交按钮之前添加字段。我怎样才能做到这一点 ?

4

1 回答 1

1

为了更好地控制表单块的呈现方式,您可以轻松地覆盖块template内部的属性Meta

首先,WagtailFormBlock使用 meta.xml 中的模板属性调整您的自定义类。我将这个类重命名为CustomFormBlockfrom MyForm,因为这样更容易理解这个类是一个流场块,而不是一个表单。

# file: blocks.py
class CustomFormBlock(WagtailFormBlock):

    class Meta:
        # template variable has been overridden...
        template = 'demo_app/wagtailformblocks/form_block.html'
        app_label = 'demo'

然后,在/templates/demo_app/wagtailformblocks/form_block.html. 您可以从WagtailFormBlocks 代码库中此块的默认模板复制和粘贴开始。

{% load static %}

<script src="{% static 'wagtailformblocks/js/formhandler.js' %}"></script>

<form action="{{ action_url }}" id="wagtailformblock_{{ form_id }}">
    {% csrf_token %}
    {% for field in form %}
        <div class="fieldWrapper">
            <strong>Custom Per Field Content for `{{ field.name }}`</strong>
            {{ field.errors }}
            {{ field.label_tag }} {{ field }}
            {% if field.help_text %}
            <p class="help">{{ field.help_text|safe }}</p>
            {% endif %}
        </div>
    {% endfor %}
    <input type="submit">
</form>

这就是您需要做的所有事情,现在每当您使用将CustomFormBlock表单链接到流场内容时,它都会使用您提供的模板自动呈现。

您可以在 Django 文档中查看有关如何以自定义方式呈现表单的更多文档:使用表单模板

笔记

于 2018-01-09T01:01:34.947 回答