[[!FormIt?
&hooks=`email,setRedirectTo,redirect`
&formName=`AskAQuestion`
&formFields=`firstname,lastname,postalcode,email,message`
&emailTpl=`ask_a_question_email`
&emailTo=`aaq@shortgrass.ca`
&redirectTo=`1`
&store=`1`
&validate=`firstname:required,
    lastname:required,
    postalcode:required,
    email:email:required,
    message:required`
&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.firstname:!empty=`<li><a href="[[~[[*id]]]]#firstname">First Name is a required field</a></li>`]]
        [[!+fi.error.lastname:!empty=`<li><a href="[[~[[*id]]]]#lastname">Last Name is a required field</a></li>`]]
        [[!+fi.error.postalcode:!empty=`<li><a href="[[~[[*id]]]]#postalcode">Postal Code 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>`
]]
<h3>Have a Question?</h3>
[[!+fi.validation_error_message:notempty=`<p>[[!+fi.validation_error_message]]</p>`]]
<form action="[[~[[*id]]]]" method="post" class="form">
    <input type="hidden" name="redirectTo" id="redirectTo" value="[[!++redirectTo]]"/>
    <div class="form-group col-md-6">
        <label for="firstname">
            First Name <span style="color: red;">*</span> <span class="error">[[!+fi.error.firstname]]</span>
        </label>
        <input type="text" name="firstname" class="form-control" id="firstname" value="[[!+fi.firstname]]" placeholder="Enter your first name"/>
    </div>
    <div class="form-group col-md-6">
        <label for="lastname">
            Last Name <span style="color: red;">*</span> <span class="error">[[!+fi.error.lastname]]</span>
        </label>
        <input type="text" name="lastname" class="form-control" id="lastname" value="[[!+fi.lastname]]" placeholder="Enter your last name"/>
    </div>
    <div class="form-group col-md-6">
        <label for="postalcode">
            Postal Code <span style="color: red;">*</span> <span class="error">[[!+fi.error.postalcode]]</span>
        </label>
        <input type="text" name="postalcode" class="form-control" id="postalcode" value="[[!+fi.postalcode]]" placeholder="Enter your postal code"/>
    </div>
    <div class="form-group col-md-6">
        <label for="email">
            Email <span style="color: red;">*</span> <span class="error">[[!+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 col-md-12">
        <label for="message">
            Message <span style="color: red;">*</span> <span class="error">[[!+fi.error.message]]</span>
        </label>
        <span style="display: block;">The more specific you are, the better our answer will be.</span>
        <textarea type="textarea" name="message" id="message" class="form-control" rows="5" value="[[!+fi.message]]" placeholder="Enter your message">[[!+fi.message]]</textarea>
    </div>
    <!--<div class="form-group">-->
    <!--[[!recaptchav2_render]]-->
    <!--[[!+fi.error.recaptchav2_error]]-->
    <!--</div>-->
    <div class="form-buttons col-md-12">
        <input type="submit" name="submit" value="Send Question"/>
    </div>
</form>