Having Trouble with Formit

I'm using MODX Revolution 2.3.3.

I've been using the tutorial here: http://www.cmstricks.com/blog/2013/03/21/modx-form-submission-with-formit/

I installed Formit, copied the finished code from the tutorial and created a MyEmailChunk. The validation works but when I hit Submit, the form just reloads and I never get a success message. Nor do I get an email.

Am I doing this right? Do I just install Formit, create the resource with the Formit code and the MyEmailChunk? Do I have to create any snippets or does the Formit install do that for me?

The MyEmailChunk:

<p>Name: [[+name]]</p>
<p>Email: [[+email]]</p>
<p>Comment: [[+comment]]</p>

The Code:

<div class="container">

[[!FormIt?
&hooks=`email`
&emailFrom=`donotreply[@]youremail.com`
&emailTpl=`MyEmailChunk`
&emailTo=`[[+email]]`
&emailSubject=`Your Subject Goes Here`
&validate=`name:required,
email:email:required,
comment:required:stripTags`
&successMessage=`<div class="alert alert-success marginTop25">
<button type="button" class="close" data-dismiss="alert">×</button>
<h3>Your comment has been submitted successfully, please check your email.</h3>
</div>`
&validationErrorMessage=`<div class="alert alert-error">
<button type="button" class="close" data-dismiss="alert">×</button>
<h3>Please review the following errors:</h3>
<ul>
[[!+fi.error.name:!empty=`<li><a href="[[~[[*id]]]]#name">Name is a required field</a></li>`]]
[[!+fi.error.email:!empty=`<li><a href="[[~[[*id]]]]#email">Email is a required field</a></li>`]]
[[!+fi.error.comment:!empty=`<li><a href="[[~[[*id]]]]#comment">Comment is a required field</a></li>`]]
</ul>
</div>`
]]

[[!+fi.validation_error_message:!empty=`
<div class="alert alert-error marginTop25">
<button type="button" class="close" data-dismiss="alert">×</button>
<h3>Please review the following errors:</h3>
<ul>
[[!+fi.error.name:!empty=`<li><a href="[[~[[*id]]]]#name">Name is a required field</a></li>`]]
[[!+fi.error.email:!empty=`<li><a href="[[~[[*id]]]]#email">Email is a required field</a></li>`]]
[[!+fi.error.comment:!empty=`<li><a href="[[~[[*id]]]]#comment">Comment is a required field</a></li>`]]
</ul>
</div>`]]

[[!+fi.successMessage]]


<div class="well marginTop25">
<form action="[[~[[*id]]]]" method="post">
<div class="[[!+fi.error.name:notempty=`control-group error`]]" id="name">
<label for="name">Name: [[!+fi.error.name:notempty=`<span class="label label-important">This is a required field.</span>`]]</label>
<div class="controls">
<input type="text" name="name" value="[[!+fi.name]]" class="input-block-level">
</div>
</div>

<div class="[[!+fi.error.email:notempty=`control-group error`]]" id="email">
<label for="email">Email: [[!+fi.error.email:notempty=`<span class="label label-important">This is a required field.</span>`]]</label>
<div class="controls">
<input type="text" name="email" value="[[!+fi.email]]" class="input-block-level">
</div>
</div>

<div class="[[!+fi.error.comment:notempty=`control-group error`]]" id="comment">
<label for="comment">Comment: [[!+fi.error.comment:notempty=`<span class="label label-important">This is a required field.</span>`]]</label>
<div class="controls">
<textarea name="comment" cols="30" rows="10" value="[[!+fi.comment]]" class="input-block-level"></textarea>
</div>
</div>

<input type="submit" value="Submit" class="btn btn-primary">


</form>

</div>

</div>

To begin with, when posting here, if you use the "<>" button in the editor's toolbar it encloses code so that it's much more readable.

You also need to change the sample email address to the address to which you want the form to send. This is usually not to the person filling out the form. Your use of [[+email]] there will send the form's email to that user. You can leave it out altogether, in which case it will send it to the email address you have in the site's System Settings (emailsender). Usually I'll use that [[+email]] placeholder from the form for the &emailFrom property.

Sorry, I should have enclosed the code.

Regarding the email address, as the code stands now, my understanding is the email gets sent to the email address entered into the form. When I put this into production, I plan to change it. As it is, I still get no success message or email.

I'm wondering if I missed anything in the implementation of Formit. I did the following:

1. Installed Formit.
2. Created the MyEmailChunk.
3. Added the code to my resource.

Any troubleshooting advice is appreciated.

Here's the code again:

FWIW, I set up the Simple Contact Form example from the Formit Documentation and it works fine. So my Formit installation works fine.

Try stripping your form and formit settings until it workd, altho I would start bij entering a real emailadress instead of the placeholder.

Did you try

1. setting a static/fixed &emailTo?
2. remove your custom error-message and just test to go with the default one?

I actually don't see why you set an error-message in the settings just to overwrite it with exactly the same message if any error occurs. Usually you just go with something like

As Susan mentioned earlier, you should replace the property with an email address. The [[+email]] placeholder is set post-submission, which is probably why your form is failing. Those placeholders are used inside the &emailTpl chunk to display the data submitted by the user.

Try this: