How to upgrade from th_mailformplus to Formhandler
A lot of forms out there still use th_mailformplus. If you are thinking of (and you should be) updating to Formhandler, here is a short explanation of how to change the TypoScript of th_mailformplus forms to work with Formhandler.
This is not a complete tutorial, it is a mere listing of the most basic differences between th_mailformplus and Formhandler. Many of the TypoScript settings have the same name, but some names have changed, were removed or are new in Formhandler.
TypoScript
A TypoScript setup for th_mailformplus may look something like this:
plugin.tx_thmailformplus_pi1 {
langFile = typo3conf/ext/th_mailformplus/example_form/singlepage_forms/improved_demo_lang.php
default {
email_to = admin@host.com
email_sendtouser = email
email_subject_user = Your contact request
email_sender = noreply@host.com
}
fieldConf {
name {
errorCheck = required
}
email {
errorCheck = required,email
}
text {
errorCheck = required
}
}
}
In this configuration there is included a translation file, error checks are defined and settings for emailing an admin and the user are made.
The same configuration for Formhandler will look like this:
plugin.Tx_Formhandler.settings {
langFile = typo3conf/ext/th_mailformplus/example_form/singlepage_forms/improved_demo_lang.php
validators.1.class = Validator\DefaultValidator
validators.1.config.fieldConf {
name {
errorCheck.1 = required
}
email {
errorCheck.1 = required
errorCheck.2 = email
}
text {
errorCheck.1 = required
}
}
finishers.1.class = Finisher\Mail
finishers.1.config {
admin {
to_email = admin@host.com
sender_email = noreply@host.com
}
user {
to_email = email
sender_email = noreply@host.com
subject = Your contact request
}
}
}
As you can see, the configuration looks similar, but Formhandler incorporates blocks like “validators” or “finishers” to allow for the grouping of any number of classes. This makes it possible to have a class “finishers.1” that sends emails and a class “finishers.2” that stores data in a database.
When you compare the TypoScript for th_mailformplus with the TypoScript for Formhandler you will find that they are overall very similar and you should have not encounter any significant troubles in configurating Formhandler if you have used th_mailformplus before.
HTML
Upgrading the HTML from th_mailformplus to Formhandler is easier than you might expect. Formhandler's markers and subparts are very similiar to those of th_mailformplus. Have a look at this th_mailformplus HTML template of a simple contact form:
<-- ###TEMPLATE_FORM### begin -->
<div class="mailformplus_contactform">
###ERROR###
<form name="contact_form" method="post" action="###REL_URL###">
<input type="hidden" name="id" value="###PID###" />
<input type="hidden" name="submitted" value="1" />
<input type="hidden" name="L" value="###value_L###" />
<input type="hidden" name="type" value="###value_type###" />
<div>
<label for="name">###LLL:name######required_name###</label>
<input type="text" name="name" id="name" value="###value_name###"/>
<br/>
<label for="subject">###LLL:subject###</label>
<input type="text" name="subject" id="subject" value="###value_subject###"/>
<br/>
<label for="email">###LLL:email######required_name###</label>
<input type="text" name="email" id="email" value="###value_email###"/>
<br/>
<label for="phone">###LLL:phone###</label>
<input type="text" name="phone" id="phone" value="###value_phone###"/>
<br/>
<label for="text">###LLL:text######required_name###</label>
<textarea cols="50" rows="5" name="text" id="text">###value_text###</textarea>
<br/>
<div class="caption">###LLL:contact_via###</div>
<input type="radio" name="contact_via" value="email" id="contact_email" ###checked_contact_via_email### />
<label for="contact_email">###LLL:contact_via_email###</label><br />
<input type="radio" name="contact_via" value="phone" id="contact_phone" ###checked_contact_via_phone### />
<label for="contact_phone">###LLL:contact_via_phone###</label>
<br/>
<p>###LLL:required_fields###</p>
<input type="submit" value="###LLL:submit###"/>
</div>
</form>
</div>
<!-- ###TEMPLATE_FORM### end -->
Now we will take this template and make it compatible to the new Formhandler.
The changes will be:
- Change the subpart ###TEMPLATE_FORM### to ###TEMPLATE_FORM1###
- Add ###submit_nextStep### to the submit button
- You can remove all the hidden fields on top of your form. Formhandler will add them automatically. If you want to control the position of the hidden fields, you can use the marker ###HIDDEN_FIELDS### in your template.
- Rename the subpart ###TEMPLATE_SUBMITTED_OK### to ###TEMPLATE_SUBMITTEDOK###, if you are using it.
- The E-Mail subparts are now named:
- ###TEMPLATE_EMAIL_USER_PLAIN###
- ###TEMPLATE_EMAIL_USER_HTML###
- ###TEMPLATE_EMAIL_ADMIN_PLAIN###
- ###TEMPLATE_EMAIL_ADMIN_HTML###
Those are all the changes you need to make. All other markers are exactly the same in Formhandler.
- ###value_[fieldname]###
- ###error_[fieldname]###
- ###LLL:[key]###
- ###required_[fieldname]###
- ###checked_[fieldname]_[fieldvalue]###
- ###selected_[fieldname]_[fieldvalue]###
To make things crystal clear, here is the completely overhauled code that works with Formhandler:
<-- ###TEMPLATE_FORM1### begin -->
<div class="formhandler_contactform">
###ERROR###
<form name="contact_form" method="post" action="###REL_URL###">
###HIDDEN_FIELDS###
<input type="hidden" name="type" value="###value_type###" />
<div>
<label for="name">###LLL:name######required_name###</label>
<input type="text" name="name" id="name" value="###value_name###"/>
<br/>
<label for="subject">###LLL:subject###</label>
<input type="text" name="subject" id="subject" value="###value_subject###"/>
<br/>
<label for="email">###LLL:email######required_name###</label>
<input type="text" name="email" id="email" value="###value_email###"/>
<br/>
<label for="phone">###LLL:phone###</label>
<input type="text" name="phone" id="phone" value="###value_phone###"/>
<br/>
<label for="text">###LLL:text######required_name###</label>
<textarea cols="50" rows="5" name="text" id="text">###value_text###</textarea>
<br/>
<div class="caption">###LLL:contact_via###</div>
<input type="radio" name="contact_via" value="email" id="contact_email" ###checked_contact_via_email### />
<label for="contact_email">###LLL:contact_via_email###</label><br />
<input type="radio" name="contact_via" value="phone" id="contact_phone" ###checked_contact_via_phone### />
<label for="contact_phone">###LLL:contact_via_phone###</label>
<br/>
<p>###LLL:required_fields###</p>
<input type="submit" value="###LLL:submit###" ###submit_nextStep###/>
</div>
</form>
</div>
<!-- ###TEMPLATE_FORM1### end -->