TYPO3 Core

I did the layout override because I wanted in the form the input before the label. According to the manual this is the correct way. If i use <inputvalue /> no Checkbox is rendered in the form.

Same Problem:

tt_content.mailform.20 {
    layout {
        radio (
            <input /><label />
        )
        checkbox (
            <input /><label />
        )
    }
}

FE-Rendering of the form is correct. The email after submit does not contain the selected options. Instead there are rendered input fields.

Typo3 4.6.3

this issue is related to #32463 - custom layouts a) can cause exceptions and b) bork your html mail layout. Solution is described in #32463

Hi,

as this issue is very old. Does the problem still exists within newer versions of TYPO3 CMS (6.1)?

Or is this a duplicate of #32463 ?

I can confirm this issue still exists with 6.1.5:

tt_content.mailform.20 {
    layout {
        checkbox = <input /><label/>
    }
}

Front-end rendering is correct. The email contains rendered input fields.

Alexander Opitz wrote:

Hi,

as this issue is very old. Does the problem still exists within newer versions of TYPO3 CMS (6.1)?

Or is this a duplicate of #32463 ?

Although this issue is related to #32463, I don't think it is a duplicate. #32463 deals with a fatal error, this issue deals with borked HTML mail output. Maybe the solution would be the same.

I can confirm this issue in TYPO3 4.7.17.

This issue still exists with 6.2.beta:¶

tt_content {
    mailform.20 {
        layout {
            form (
                <form role="form">
                    <containerWrap />
                </form>
            )
            containerWrap (
                <div class="csc-mailform-container">
                    <elements />
                </div>
            )
            elementWrap (
                <div class="form-group">
                    <element />
                </div>
            )
            textline (
                <label />
                <input class="form-control" />
            )
            textarea (
                <label />
                <textarea class="form-control" />
            )
            textblock (
                <p class="help-block">
                    <textblock />
                </p>
            )
            submit (
                <input class="btn btn-primary" />
            )
        }
    }
}

This layout example above to have nice bootstrap-like form elements will brake the Html Mail Message.
Following the Manual, the tt_content.mailform.20.layout TypoScript is a layout definition (override) for the Frontend which works like a charm..
The bad thing is, that the AbstractElementView.php in form/Classes/View/Mail/Html/Element also respects a layout override for the frontend like above to render the HTML Code for the mail message.

This is a serious problem. The solution should be simple:
give the opportunity to define different layouts for the frontend as well as for the html mail, like

tt_content {
    mailform.20 {
        # Layout Override for the Frontend HTML View
        form {
            layout {
                elementWrap (
                    ...
                )
            }
        }
        # Layout Override for the HTML Mail Message
        mail {
            layout {
                elementWrap (
                    ...
                )
            }
        }
    }
}

From my point of view and different testcases the layouts are not useable at all in its current state so whatever gets decided how to solve this problem it will not break any functionality somewhere.

The only way to get the ext:form working correctly at its current state is to xclass every view model and change the default layout directly in the model.

Views in 6.2
- Form (uses layout)
- Confirmation (uses layout)
- Mail (is a postProcessor)
-- Html (uses layout)
-- Plain (does not use layouts)

Example Default Layouts why the system breaks:

TextlineElementView (Form)

    <label />
    <input />

TextlineElementView (Confirmation)

    <label />
    <inputvalue />

TextlineElementView (Mail/Html)

    <td style="width: 200px;">
        <label />
    </td>
    <td>
        <inputvalue />
    </td>

The problem here is when you try to what the different views do not support all elements in its parseXML functions,
for example the <input /> is not handled by the confirmation or the mail views under certain conditions the system then will break.

An example of an breaking ext:form configuration can be found in the bootstrap_package that comes with the introduction distribution.

tt_content.mailform.20 {
    layout {
        form (
            <form class="form-horizontal">
                <containerWrap />
            </form>
        )
        containerWrap (
            <div>
                <elements />                
            </div>
        )
        elementWrap (
            <div>      
                <element />
            </div>
        )
        fieldset (
            <fieldset><legend /><containerWrap /></fieldset>    
        )
        label (
            <label>
                <labelvalue />
                <mandatory />
            </label>
    )
        error (
            <span class="help-block text-danger"><errorvalue /></span>
        )

        textline (
            <div class="form-group">
                <div class="col-sm-3 control-label">
                    <label />
                </div>
                <div class="col-sm-5">
                    <input class="form-control" />
                    <error />
                </div>
            </div>
        )
        textarea (
            <div class="form-group">
                <div class="col-sm-3 control-label">
                    <label />
                </div>
                <div class="col-sm-5">
                    <textarea class="form-control" />
                    <error />
                </div>
            </div>
        )
        submit (
            <div class="form-group">
        <div class="col-sm-offset-3 col-sm-9">
                    <input class="btn btn-primary" />
        </div>
            </div>
        )
        checkbox (
            <div class="form-group">
        <div class="col-sm-offset-3 col-sm-9">
                    <div class="checkbox">
                        <input />
                        <label />
                    </div>
                    <error />
        </div>
            </div>
        )
    }
    stdWrap.wrap = |
}

Suggestion:
Introduce new strict seperation for the form layout and correct the typoscript settings for this.

- form.layout used only for form
- confirmation.layout used only for confirmation
- postProcessorDefaults.mail.layout used only for postprocessor mail layout
- postProcessorDefaults.Vendor\ExtensionKey\PostProcess\CustomPostProcessor.layout for example usage in custom postprocessor

Map current layout to -> form.layout so that nothing will break when someone already uses this.

tt_content.mailform.20 {
    form {
        ...
        layout {
            ...
        }
    }
    confirmation {
        message = TEXT
        message {
            value = Check input
            wrap = <p>|</p><hr/>
        }
        layout {
            ...
        }
    }
    postProcessorDefaults {
        mail {
            layout {
                ...
            }
        }
        Vendor\ExtensionKey\PostProcess\CustomPostProcessor {
            layout {
                ...
            }        
        }
    }
    postProcessor {
        1 = mail
        1 {
            recipientEmail = {$plugin.tx_form.mail.recipientEmail}
            senderEmail = {$plugin.tx_form.mail.senderEmail}
            subject = {$plugin.tx_form.mail.subject}
            messages {
                success = Mail send.
            }
            mail {
                layout {
                    ...
                }
            }
        }
    }
}

Patch set 2 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/28526

Patch set 3 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/28526

Patch set 5 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/28526

Patch set 6 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/28526

Patch set 7 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/28526

Patch set 8 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/28526