I have been copying from
http://www.cmstricks.com/blog/2013/03/21/modx-form-submission-with-formit/ this code:
<link rel="stylesheet" type="text/css" href="assets/css/contactForm.css">
[[!FormIt? &hooks=`email` &emailFrom=`[[+email]]` &emailTpl=`contactForm` &emailTo=`[email protected]` &emailSubject=`drop me a line` &validate=`name:required, email:email:required, comment:required:stripTags` &successMessage=`
<div class="alert alert-success marginTop25"><button class="close" type="button" data-dismiss="alert">×</button>
<h3>Your comment has been submitted successfully, please check your email.</h3>
</div>
` &validationErrorMessage=`
<div class="alert alert-error"><button class="close" type="button" 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 "><button class="close" type="button" data-dismiss="alert">×</button>
<p>following errors:</p>
<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 id="name" class="[[!+fi.error.name:notempty=`control-group error`]]"><label for="name">Name [[!+fi.error.name:notempty=`<span class="label label-important">This is a required field.</span>`]]</label>
<div class="controls"><input class="input-block-level" type="text" name="name" value="[[!+fi.name]]" /></div>
</div>
<div id="email" class="[[!+fi.error.email:notempty=`control-group error`]]"><label for="email">Email [[!+fi.error.email:notempty=`<span class="label label-important">This is a required field.</span>`]]</label>
<div class="controls"><input class="input-block-level" type="text" name="email" value="[[!+fi.email]]" /></div>
</div>
<div id="comment" class="[[!+fi.error.comment:notempty=`control-group error`]]"><label for="comment">__[[!+fi.error.comment:notempty=`<span class="label label-important">This is a required field.</span>`]]</label>
<div class="controls"><textarea class="input-block-level" name="comment" rows="11" cols="30"></textarea></div>
</div>
<input class="btn btn-primary plus" type="submit" value="@" /></form></div>
And works fine, except the close alert button, which may be style vis Bootstrap? is there a quick trip for me to cloise the error, or do I need involving javascript css styling to hide the alert again?