ElementInternals: reportValidity() method
Baseline 2023
Newly available
Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
The reportValidity()
method of the ElementInternals
interface checks if the element meets any constraint validation rules applied to it.
If reportValidity
returns false
then a cancelable invalid event is fired on the element.
This method behaves in a similar way to ElementInternals.checkValidity()
, however it additionally sends the value of ElementInternals.validationMessage
to the user agent for display.
Syntax
reportValidity()
Parameters
None.
Return value
A boolean value, true
if the element meets all validation constraints.
Exceptions
NotSupportedError
DOMException
-
Thrown if the element does not have its
formAssociated
property set totrue
.
Examples
In the following example ElementInternals.setValidity()
is used to indicate that the element does not meet validation rules. Calling reportValidity()
returns false
, and the value "my message" is sent to the user agent for display.
After calling setValidity
again, this time indicating that all rules are marked false, reportValidity()
returns true
.
let element = document.getElementById("join-checkbox");
element.internals_.setValidity({ valueMissing: true }, "my message");
console.log(element.internals_.reportValidity()); // false
element.internals_.setValidity({});
console.log(element.internals_.reportValidity()); // true
Specifications
Specification |
---|
HTML Standard # dom-elementinternals-reportvalidity |
Browser compatibility
BCD tables only load in the browser