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

EXT:Form - Get layout field from content object data

我正在尝试获取 ext:form 内容元素中内容对象数据的布局字段,如果选择了特定布局,则添加 css class。但是,既没有将内容对象数据添加到流体模板 (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.

中被硬编码

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

fluid_styled_content 的 Generic-Template 中提供了内容对象数据。在这里您可以检查 Ctype 是否为 'form_formframework' 并用 css class.

包装表格
<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>

我们可以像这样添加流体模板布局({f:if(condition:'{data.layout}',then:'blue')}),到默认fluid_style_content/Resource/Private/Layouts/default.html(我们可以在我们的站点模板中覆盖流体模板) - 无需考虑覆盖表单的修整器和 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>

希望对大家有所帮助!