Custom validation

The browser can validate emails, numbers and text length on its own, but it knows nothing about your own business rules, like "the code starts with SA" or "the quantity is a multiple of five."

When you call input.setCustomValidity('message'), the field becomes invalid and your message is attached to it. When you call setCustomValidity(''), the field is valid again. That way your rule becomes part of the browser's own validation, instead of a separate check you write next to it.

Most importantly, clear the message first every time you validate. Otherwise the field stays invalid forever after the first error.