Email confirmation error

I'm trying to get a confirm email field working... I've used the 'match-with' attribute which seems to work, but I can't get an error message to display when the email's don't match. Any ideas?

<div class="form-row">
    <perch:label for="email">Email</perch:label>
    <perch:input type="email" id="email" match-with="email2" required="true" label="Email" placeholder="you@company.com" />
    <perch:error for="email" type="required"><span class="form-error">Please add your email address</span></perch:error>
    <perch:error for="email" type="format"><span class="form-error">Please check your email address</span></perch:error>
</div>
<div class="form-row">
    <perch:label for="email2">Confirm Email</perch:label>
    <perch:input type="email" id="email2" required="true" label="Email" />
    <perch:error for="email2" type="required"><span class="form-error">Please confirm your email address</span></perch:error>
    <perch:error for="email2" type="format"><span class="form-error">Email doesn't match</span></perch:error>
</div>