[Frage] tx_form - unterschiedliche Varianten eines Partials TYPO3-Version: 8.7.16

  • wini2 wini2
    Jedi-Meister
    0 x
    286 Beiträge
    0 Hilfreiche Beiträge
    02. 07. 2018, 15:32

    Hallo,

    ich habe mehrere Formulare, die Felder mit Radio-Buttons enthalten. In einem Fromular würde ich gern das Partail RadioButton.html etwas umstellen (d. h. mit der Klasse form-inline versehen), im zweiten Formular nicht.

    Gibt es eine einfache Möglichkeit, Varianten zu verwenden - z. B. über case, oder eine Änderung in der entspr. YAML-Datei des Formulars. Ich würde ungern ein neues Formularelement wegen einer solchen Kleinigkeit 'erfinden'.

    Danke für eure Hilfe


  • 1
  • Pingbeat Pingbeat
    T3PO
    0 x
    7 Beiträge
    0 Hilfreiche Beiträge
    02. 07. 2018, 16:46

    Ich denke du wirst um ein neues Formular-Feld nicht herum kommen wenn du es vernünftig haben möchtest.

    Ansonsten könntest du probieren im Fluid des Partials einen eigens gesetzten Variablennamen abzufangen mit einer condition und dann die Klasse setzen.

  • wini2 wini2
    Jedi-Meister
    0 x
    286 Beiträge
    0 Hilfreiche Beiträge
    02. 07. 2018, 20:00

    Hallo Pingbeat,

    danke für die schnelle Antwort. Es wäre toll, wenn du einen Tipp für mich hättest, wie ich ein neues Formelement anlegen kann - wie gesagt, es reicht völlig, wenn ich es in der YAML-Datei eintragen kann; die Auswahl im From-Manager (Backend-Modul) ist nicht nötig.

    Danke im Voraus

  • wini2 wini2
    Jedi-Meister
    0 x
    286 Beiträge
    0 Hilfreiche Beiträge
    04. 07. 2018, 18:38

    Hallo,

    ich habe eine - zugegeben unschöne Lösung gefunden. Die Idee habe ich von https://wiki.sklein-medien.de/doku.php?id=typo3:form#personalisierte_anrede_in_e-mails, wo (ganz unten) ein ähnlicher Fall gelöst wird. Ich habe kurzer Hand das komplette Radio in einzelnen Fällen abgearbeitet, die sich auf die renderables in der yaml-Datei beziehen.

    properties:
    options:
    Frau: Frau
    Herr: Herr
    ...
    type: RadioButton
    identifier: radiobutton-inline
    label: Anrede
    validators:
    -
    identifier: NotEmpty
    ...

    Das Partial sieht dann so aus (wichtig ist nur das switch-case-Konstrukt [nur eine zus. css-Klasse, in der sich das Ganze sonst unterscheidet]):

    <html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:formvh="http://typo3.org/ns/TYPO3/CMS/Form/ViewHelpers" data-namespace-typo3-fluid="true">
    <formvh:renderRenderable renderable="{element}">
    <f:switch expression="{element.identifier}">

    <f:comment>fallunterscheidung, um partial für einzelne formulare anpassen zu können.</f:comment>

    <f:comment>Radio Anrede - INLINE im Kontaktformular</f:comment>
    <f:case value="radiobutton-inline">

    <f:render partial="Field/Field" arguments="{element: element}" contentAs="elementContent">
    <div id="{element.uniqueIdentifier}" class="inputs-list">
    <div class="form-group form-inline">
    <f:for each="{element.properties.options}" as="label" key="value" iteration="idIterator">
    <div class="form-check form-check-inline">
    <f:form.radio
    property="{element.identifier}"
    id="{element.uniqueIdentifier}-{idIterator.index}"
    class="{element.properties.elementClassAttribute} form-check-input"
    value="{value}"
    errorClass="{element.properties.elementErrorClassAttribute}"
    additionalAttributes="{formvh:translateElementProperty(element: element, property: 'fluidAdditionalAttributes')}"
    />

    <label class="form-check-label" for="{element.uniqueIdentifier}-{idIterator.index}"><span>{formvh:translateElementProperty(element: element, property: '{0: \'options\', 1: value}')}</span></label>
    </div>
    </f:for>
    </div>
    </div>
    </f:render>

    </f:case>

    <f:comment>2. vorkommen in einem Formular (einmaliger name)</f:comment>
    <f:case value="radiobutton-inline2">

    <f:render partial="Field/Field" arguments="{element: element}" contentAs="elementContent">
    <div id="{element.uniqueIdentifier}" class="inputs-list">
    <div class="form-group form-inline">
    <f:for each="{element.properties.options}" as="label" key="value" iteration="idIterator">
    <div class="form-check form-check-inline">
    <f:form.radio
    property="{element.identifier}"
    id="{element.uniqueIdentifier}-{idIterator.index}"
    class="{element.properties.elementClassAttribute} form-check-input"
    value="{value}"
    errorClass="{element.properties.elementErrorClassAttribute}"
    additionalAttributes="{formvh:translateElementProperty(element: element, property: 'fluidAdditionalAttributes')}"
    />

    <label class="form-check-label" for="{element.uniqueIdentifier}-{idIterator.index}"><span>{formvh:translateElementProperty(element: element, property: '{0: \'options\', 1: value}')}</span></label>
    </div>
    </f:for>
    </div>
    </div>
    </f:render>

    </f:case>


    <f:defaultCase>

    <f:render partial="Field/Field" arguments="{element: element}" contentAs="elementContent">
    <div id="{element.uniqueIdentifier}" class="inputs-list">
    <div class="form-group">
    <f:for each="{element.properties.options}" as="label" key="value" iteration="idIterator">
    <div class="form-check">
    <label class="form-check-label" for="{element.uniqueIdentifier}-{idIterator.index}">
    <f:form.radio
    property="{element.identifier}"
    id="{element.uniqueIdentifier}-{idIterator.index}"
    class="{element.properties.elementClassAttribute} form-check-input"
    value="{value}"
    errorClass="{element.properties.elementErrorClassAttribute}"
    additionalAttributes="{formvh:translateElementProperty(element: element, property: 'fluidAdditionalAttributes')}"
    />
    <span>{formvh:translateElementProperty(element: element, property: '{0: \'options\', 1: value}')}</span>
    </label>
    </div>
    </f:for>
    </div>
    </div>
    </f:render>
    </f:defaultCase>


    </f:switch>
    </formvh:renderRenderable>
    </html>


    Leider muss man jeden Fall kopieren und eigens abhandeln; zumindest habe ich keine Ahnung, wie ich bei case ein oder angeben kann.

    Ist sicher keie gute Lösung, auch wenn es meinen konkreten Anwendungsfall genügen mag. Wäre schön, wenn jemand eine bessere/einfachere Lösung posten könnte.

  • 1