[[!form_wrapper?
&hooks=`email,setRedirectTo,redirect`
&formName=`ContactForm`
&formFields=`name,email,message`
&emailTpl=`contact_form_email`
&emailSubject=`Contact Form Submission`
&emailTo=`[[+emailTo]]`
&redirectTo=`1`
&redirectParams=`[[+staff]]`
&store=`1`
&validate=`name:required,
    email:email:required,
    message:required:stripTags`
&successMessage=`<div class="alert alert-success">
    <button type="button" class="close" data-dismiss="alert">&times;</button>
    <h3>Your message has been submitted successfully.</h3>
</div>`
&validationErrorMessage=`<div class="alert alert-danger">
    <button type="button" class="close" data-dismiss="alert">&times;</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.message:!empty=`<li><a href="[[~[[*id]]]]#message">Message is a required field</a></li>`]]
    </ul>
</div>`
]]

[[!+fi.validation_error_message:!empty=`
<div class="alert alert-danger">
    <button type="button" class="close" data-dismiss="alert">&times;</button>
    <h3>Please review the following errors:</h3>
    <ul class="alert-link">
        [[!+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.message:!empty=`<li><a href="[[~[[*id]]]]#message">Message is a required field</a></li>`]]
    </ul>
</div>`]]

<form action="[[~[[*id]]]]" method="post" class="form">
    <input type="hidden" name="redirectTo" id="redirectTo" value="[[!++redirectTo]]"/>
    <input type="hidden" name="emailTo" id="emailTo" value=""/>
    <input type="hidden" name="staff" id="staff" value="[[!++staff]]"/>
    <div class="form-group">
        <label for="name">
            Name <span class="asterisk">*</span> <span class="alert-danger">[[!+fi.error.name]]</span>
        </label>
        <input type="text" name="name" class="form-control" id="name" value="[[!+fi.name]]" placeholder="Enter your name"/>
    </div>
    <div class="form-group">
        <label for="email">
            Your Email Address<span class="asterisk">*</span> <span class="alert-danger">[[!+fi.error.email]]</span>
        </label>
        <input type="text" name="email" class="form-control" id="email" value="[[!+fi.email]]" placeholder="Enter your email"/>
    </div>
    <div class="form-group">
        <label for="message">
            Message <span class="asterisk">*</span> <span class="alert-danger">[[!+fi.error.message]]</span>
        </label>
        <textarea type="textarea" name="message" id="message" class="form-control" rows="5" value="[[!+fi.message]]" placeholder="Enter your message">[[!+fi.message]]</textarea>
    </div>
    
    <!-- Captcha Stuff -->
    <div class="form-buttons">
        <input type="submit" name="submit" value="Send Message"/>
    </div>
</form>