Task #68646

Epic #69955: Optimize new Extbase/ Fluid based rewrite of EXT:form

Outer Layout for FORM mails cannot be changed

Added by Dennis Schubert over 4 years ago. Updated about 4 years ago.

Status:
Closed
Priority:
Should have
Assignee:
-
Category:
Form Framework
Target version:
Start date:
Due date:
% Done:

100%

TYPO3 Version:
7
PHP Version:
Tags:
Complexity:
Sprint Focus:

Description

I'm using the FORM cObject provided by the form sysext and trying to change the outer layout, i.e. this source:

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    </head>
    <body>
        <table cellspacing="0">
            <containerWrap />
        </table>
    </body>
</html>

I found elementWrap and other TYPOScript configurations, but apparently it is not possible to change the above code.

History

#1 Updated by Bjoern Jacob over 4 years ago

  • Category set to Form Framework
  • Status changed from New to Needs Feedback
  • Assignee set to Dennis Schubert

Could you please provide a desired output, i.e. what do you want to change/ achieve?

Thx, Björn

#2 Updated by Dennis Schubert over 4 years ago

I'd like to remove the table and replace it by a div, for example.

#3 Updated by Alexander Opitz over 4 years ago

  • Status changed from Needs Feedback to New
  • Assignee deleted (Dennis Schubert)

#4 Updated by Ralf Zimmermann over 4 years ago

Could you please provide the typoscript you use?

#5 Updated by Dennis Schubert about 4 years ago

tt_content.mailform.20 {
    stdWrap.wrap = <div class="formContainerWrap"><div class="formContainer container-fluid">|</div></div>

    layout {
        elementWrap (
            <div class="form-group row">
                <div class="col-xs-12">
                    <element />
                </div>
            </div>
        )

        error (
            <span class="text-danger pull-right">
                <errorvalue />
            </span>
        )
        textline (
            <label />
            <input class="form-control" />
        )

        textarea (
            <label />
            <textarea class="form-control" />
        )

        select (
            <label />
            <select class="form-control">
                <elements />
            </select>
        )
    }
}

Backend configuration:

enctype = multipart/form-data
method = post
prefix = tx_form
confirmation = 0
postProcessor {
    1 = mail
    1 {
        recipientEmail = foo@example.com
        senderEmailField = E-Mail
        senderNameField = Nachname
        subject = Kontaktanfrage von Website
        messages {
            success = <div class="contentElementContainer container-fluid"><p class="sectionIntro">Ihre Anfrage wurde erfolgreich versandt.</p></div>
        }
    }
}

HTML of sent emails:

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body>
        <table cellspacing="0">
            <tbody>
                <div class="csc-form-2 csc-form-element csc-form-element-select">
                    <div class="col-xs-12">
                        ...
                    </div>
                </div>

                ...
            </tbody>
        </table>
    </body>
</html>

and it seems to be impossible to remove the table.

#6 Updated by Bjoern Jacob about 4 years ago

  • Parent task set to #69036

#7 Updated by Ralf Zimmermann about 4 years ago

  • Assignee set to Dennis Schubert

Is is possible to change the html wrap with the property "html"

prefix = tx_form

postProcessor {
    layout {
        html (
            <div class="htmlWrap"><containerWrap /></div>
        )

        containerWrap (
            <div class="containerWrap"><elements /></div>
        )

        elementWrap (
            <div><element /></div>
        )

        textline (
          <label />
          <inputvalue />
        )
    }

    1 = mail
    1 {
        recipientEmail = test@example.com
        senderEmail = test@example.com
    }
}

10 = TEXTLINE
10 {
    name = 2
    label.value = Edit this label
}

20 = SUBMIT
20 {
    name = 3
    value = Submit form
}

This Typoscript results in a Mail like this

<div class="htmlWrap">
  <div class="containerWrap">
    <div class="csc-form-2 csc-form-element csc-form-element-textline">
      <em>Edit this label</em>test</div>
  </div>
</div>

@Björn: documentation required?

#8 Updated by Bjoern Jacob about 4 years ago

  • Tracker changed from Bug to Task

#9 Updated by Dennis Schubert about 4 years ago

I can confirm a working solution using the postProcessor. Documentation would be nice, though.

#10 Updated by Bjoern Jacob about 4 years ago

  • Status changed from New to In Progress
  • Assignee changed from Dennis Schubert to Bjoern Jacob

Awesome. I'll take care of the documentation.

#11 Updated by Bjoern Jacob about 4 years ago

  • Status changed from In Progress to New
  • Target version set to 7 LTS
  • Parent task changed from #69036 to #69955

#12 Updated by Bjoern Jacob about 4 years ago

  • Status changed from New to In Progress
  • Start date deleted (2015-07-30)

#13 Updated by Bjoern Jacob about 4 years ago

  • Status changed from In Progress to Closed
  • Assignee deleted (Bjoern Jacob)
  • % Done changed from 0 to 100

This has now been documented and will be pushed with the huge patchsets for the whole documentation.

Also available in: Atom PDF