Password Confirmation
Default validation message with required fields.
Password + Password again
<form-matching-fields>
<label for="password">Password</label>
<input id="password" type="password" required />
<label for="password-again">Password again</label>
<input id="password-again" type="password" required />
</form-matching-fields>
Email Verification
Validation works with other text-like types such as email.
Email + Verify email
<form-matching-fields>
<label for="email">Email</label>
<input id="email" type="email" required />
<label for="email-again">Verify email</label>
<input id="email-again" type="email" required />
</form-matching-fields>
Custom Message
Override the default text using the validation-message attribute.
Custom mismatch copy
<form-matching-fields validation-message="Please make sure {label_2} matches {label_1}.">
<label for="email-custom">Email</label>
<input id="email-custom" type="email" required />
<label for="email-custom-again">Verify email</label>
<input id="email-custom-again" type="email" required />
</form-matching-fields>
Localized Message (Hindi)
Localization is just custom content with placeholders.
Hindi validation message
<form-matching-fields validation-message="{label_1} और {label_2} का मान समान होना चाहिए।">
<label for="password-hi">पासवर्ड</label>
<input id="password-hi" type="password" required />
<label for="password-hi-again">पासवर्ड फिर से</label>
<input id="password-hi-again" type="password" required />
</form-matching-fields>
API Reference
For complete documentation of behavior and browser support, see the README.