EXT:Form - 从内容对象数据中获取布局字段答案

【问题标题】：EXT:Form - Get layout field from content object dataEXT:Form - 从内容对象数据中获取布局字段
【发布时间】：2019-07-23 08:28:18
【问题描述】：

我正在尝试在 ext:form 内容元素中获取内容对象数据的布局字段，以便在选择了特定布局的情况下添加一个 css 类。但是内容对象数据既没有添加到流体模板 (typo3/sysext/form/Classes/Controller/FormFrontendController.php:73) 中，也没有为此元素渲染来自 fluid_styled_content 的框架容器。我的布局字段是这样配置的：

TCEFORM.tt_content {
    layout {
        types.form_formframework {
            addItems {
                200 = Blue Form
            }

            removeItems = 1,2,3
        }
    }
}

我也尝试向表单配置本身添加一个新的布局字段：

TYPO3:
  CMS:
    Form:
      ########### FORMEDITOR CONFIGURATION ###########
      prototypes:
        standard:
          ########### DEFAULT FORM ELEMENT DEFINITIONS ###########
          formElementsDefinition:
            Form:
              formEditor:
                editors:
                  9000:
                    identifier: 'layout'
                    group: select
                    templateName: 'Inspector-SingleSelectEditor'
                    label: 'Layout'
                    propertyPath: 'properties.layout'
                    selectOptions:
                      0:
                        value:
                        label: Normal
                      1:
                        value: form--blue
                        label: Blau

这在后端很有效，但会导致前端出现The options "properties" were not allowed 错误，因为表单元素的属性在typo3/sysext/form/Classes/Domain/Model/FormDefinition.php:382 中是硬编码的。

任何想法如何在这里添加布局选择？最好是在内容元素上，因为这将允许我使用具有不同布局的相同表单配置，而不是制作仅在布局中区分的重复表单配置。

【问题讨论】：

标签： forms typo3 typo3-extensions

【解决方案1】：

内容对象数据在来自fluid_styled_content 的Generic-Template 中可用。在这里您可以检查 Ctype 是否为 'form_formframework' 并使用您的 css 类包装表单。

<f:if condition="{content}">
<f:then>
    {content -> f:format.raw()}
</f:then>
<f:else>
    <f:if condition="{data.CType} == 'form_formframework'">
        <f:then>
            <div class="{data.layout}">
                <f:cObject typoscriptObjectPath="tt_content.{data.CType}.20" data="{data}" table="tt_content"/>
            </div>
        </f:then>
        <f:else>
            <f:cObject typoscriptObjectPath="tt_content.{data.CType}.20" data="{data}" table="tt_content"/>
        </f:else>
    </f:if>
</f:else>
</f:if>

【讨论】：

【解决方案2】：

我们可以像这样({f:if(condition:'{data.layout}',then:'blue')}) 将流体模板布局添加到默认的fluid_style_content/Resource/Private/Layouts/default 中。 html（我们可以在我们的站点模板中覆盖流体模板） - 无需考虑覆盖 form 的 Finisher 和 Flexform 值：

<f:if condition="{data.CType} == 'form_formframework'">
    <f:then>
        <section id="c{data.uid}" class="form-section {f:if(condition:'{data.layout}',then:'blue')}">
            <f:if condition="{data._LOCALIZED_UID}">
                <a id="c{data._LOCALIZED_UID}"></a>
            </f:if>
            <f:render section="Before" optional="true">
                <f:render partial="DropIn/Before/All" arguments="{_all}" />
            </f:render>
            <f:render section="Header" optional="true">
                <f:render partial="Header/All" arguments="{_all}" />
            </f:render>
            <f:render section="Main" optional="true" />
            <f:render section="Footer" optional="true">
                <f:render partial="Footer/All" arguments="{_all}" />
            </f:render>
            <f:render section="After" optional="true">
                <f:render partial="DropIn/After/All" arguments="{_all}" />
            </f:render>
        </section>
    </f:then>
    <f:else>
        <div id="c{data.uid}" class="frame frame-{data.frame_class} frame-type-{data.CType} frame-layout-{data.layout}{f:if(condition: data.space_before_class, then: ' frame-space-before-{data.space_before_class}')}{f:if(condition: data.space_after_class, then: ' frame-space-after-{data.space_after_class}')}">
            <f:if condition="{data._LOCALIZED_UID}">
                <a id="c{data._LOCALIZED_UID}"></a>
            </f:if>
            <f:render section="Before" optional="true">
                <f:render partial="DropIn/Before/All" arguments="{_all}" />
            </f:render>
            <f:render section="Header" optional="true">
                <f:render partial="Header/All" arguments="{_all}" />
            </f:render>
            <f:render section="Main" optional="true" />
            <f:render section="Footer" optional="true">
                <f:render partial="Footer/All" arguments="{_all}" />
            </f:render>
            <f:render section="After" optional="true">
                <f:render partial="DropIn/After/All" arguments="{_all}" />
            </f:render>
        </div>
    </f:else>
</f:if>

希望对大家有帮助！

【讨论】：