I have seen the documentation but I am still having trouble understanding what I need to do. If anyone knows some helpful getting started documentation I would appreciate it. Thank you
In short, you have to add a call to the FormIt snippet and a normal HTML form to your page.
Here is a basic example: (This form actually does nothing at all.)
[[!FormIt?
&hooks=``
&validate=`myfield:required`
&successMessage=`Successfully sent!`
]]
[[!+fi.successMessage]]
[[!+fi.validation_error_message]]
<form id="myform" action="[[~[[*id]]]]" method="post">
<div>
[[!+fi.error.myfield]]
<label for="myfield">my Field</label>
<input type="text" name="myfield" value="[[!+fi.myfield]]">
</div>
<input type="submit" value="Send">
</form>
- When you click the “Send” button, the form data is sent to the same page
action="[[~[[*id]]]]"
- The FormIt snippet gets executed
- The snippet checks if a form has been sent (is
$_POST
empty?) - The snippet validates the sent data (is “myfield” not empty?
&validate=`myfield:required`
) - If the validation is successful, the hooks specified in the property
&hooks
are executed. - If all hooks are successfully executed, the placeholder
[[!+fi.successMessage]]
is filled with the defined success message (&successMessage
).
- The snippet checks if a form has been sent (is
- If the form validation fails, the placeholder for the general validation error message
[[!+fi.validation_error_message]]
is filled, as well as the placeholder for the specific field error message[[!+fi.error.myfield]]
.
An example of a more useful form, that sends an email and redirects:
[[!FormIt?
&hooks=`email,redirect`
&validate=`myfield:required`
&redirectTo=`1`
&emailTpl=`myEmailTemplate`
&emailSubject=`Test Mail`
&emailTo=`you@yourdomain.com`
&emailHtml=`0`
&submitVar=`mySubmit`
]]
<form id="myform" action="[[~[[*id]]]]" method="post">
<div>
[[!+fi.error.myfield]]
<label for="myfield">my Field</label>
<input type="text" name="myfield" value="[[!+fi.myfield]]">
</div>
<input type="submit" name="mySubmit" value="Send">
</form>
-
&hooks=`email,redirect`
→ After validation, FormIt first sends an email, then redirects to another page (if the email was sent successfully). -
&redirectTo
→ the page to redirect to. Used by the redirect hook -
&emailTpl
,&emailSubject
,&emailTo
, etc. → different properties for the email hook. (In the chunk “myEmailTemplate” you can use placeholders like[[+myfield]]
for the form field values.) -
&submitVar
→ must correspond to the “name” attribute of the “Send” button, if there are multiple forms on the page.
So I copied and pasted the second chunk and used it on my page. I changed the email address but the form isn’t being sent to my email. Any suggestions? Sorry it has been a few years since I have studied this stuff.
Have you set up your site for sending email? If not, here are the docs (I highly recommend using SMTP and not the PHP mail() function):
https://docs.modx.com/current/en/building-sites/sending-mail
If you have already set up email sending, that link also has troubleshooting help.
Do I have to pay for the SMTP service?
Hi @leocubs89
You don’t need to if you use your own SMTP service (your web host may provide one).
Or you could use a commercial one that provides a free tier - usually under a certain amount of usage. e.g. MailGun, SendGrid, Postmark, SES etc.