ValidityState

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨July 2015⁩.

TheValidityState interface represents thevalidity states that an element can be in, with respect to constraint validation. Together, they help explain why an element's value fails to validate, if it's not valid.

Instance properties

For each of these Boolean properties, a value oftrue indicates that the specified reason validation may have failed is true, with the exception of thevalid property, which istrue if the element's value obeys all constraints.

badInputRead only: A boolean value that istrue if the user has provided input that the browser is unable to convert.
customErrorRead only: A boolean value indicating whether the element's custom validity message has been set to a non-empty string by calling the element'ssetCustomValidity() method.
patternMismatchRead only: A boolean value that istrue if the value does not match the specifiedpattern, andfalse if it does match. Iftrue, the element matches the:invalid CSS pseudo-class.
rangeOverflowRead only: A boolean value that istrue if the value is greater than the maximum specified by themax attribute, orfalse if it is less than or equal to the maximum. Iftrue, the element matches the:invalid and:out-of-range and CSS pseudo-classes.
rangeUnderflowRead only: A boolean value that istrue if the value is less than the minimum specified by themin attribute, orfalse if it is greater than or equal to the minimum. Iftrue, the element matches the:invalid and:out-of-range CSS pseudo-classes.
stepMismatchRead only: A boolean value that istrue if the value does not fit the rules determined by thestep attribute (that is, it's not evenly divisible by the step value), orfalse if it does fit the step rule. Iftrue, the element matches the:invalid CSS pseudo-class.
tooLongRead only: A boolean value that istrue if the value exceeds the specifiedmaxlength forHTMLInputElement orHTMLTextAreaElement objects, orfalse if its length is less than or equal to the maximum length.Note: This property is nevertrue in Gecko, because elements' values are prevented from being longer thanmaxlength. Iftrue, the element matches the:invalid and:out-of-range CSS pseudo-classes.
tooShortRead only: A boolean value that istrue if the value fails to meet the specifiedminlength forHTMLInputElement orHTMLTextAreaElement objects, orfalse if its length is greater than or equal to the minimum length. Iftrue, the element matches the:invalid and:out-of-range CSS pseudo-classes.
typeMismatchRead only: A boolean value that istrue if the value is not in the required syntax (whentype isemail orurl), orfalse if the syntax is correct. Iftrue, the element matches the:invalid CSS pseudo-class.
validRead only: A boolean value that istrue if the element meets all its validation constraints, and is therefore considered to be valid, orfalse if it fails any constraint. Iftrue, the element matches the:valid CSS pseudo-class; the:invalid CSS pseudo-class otherwise.
valueMissingRead only: A boolean value that istrue if the element has arequired attribute, but no value, orfalse otherwise. Iftrue, the element matches the:invalid CSS pseudo-class.