ContextQMD
Back to Content

HTMLTextAreaElement: setCustomValidity() method

files/en-us/web/api/htmltextareaelement/setcustomvalidity/index.md

latest1.8 KB
Original Source

{{ APIRef("HTML DOM") }}

The setCustomValidity() method of the {{DOMxRef("HTMLTextAreaElement")}} interface sets the custom validity message for the {{htmlelement("textarea")}} element. Use the empty string to indicate that the element does not have a custom validity error.

Syntax

js-nolint
setCustomValidity(string)

Parameters

  • string
    • : The string containing the error message. The empty string removes any custom validity errors.

Return value

None ({{jsxref("undefined")}}).

Examples

In this example, if the <textarea>'s doesn't pass constraint validation, we provide custom errors based on the constraint that is failing validation. If the value is valid, we set the custom error to an empty string:

js
const comment = document.getElementById("comment");
if (comment.validity.valueMissing) {
  comment.setCustomValidity("We can't submit a blank comment!");
} else if (comment.validity.tooShort) {
  comment.setCustomValidity("Tell us more! Your comment is too short.");
} else if (comment.validity.tooLong) {
  comment.setCustomValidity(
    "Loquacious much? Keep it to under 800 characters!",
  );
} else {
  comment.setCustomValidity("");
}

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}

See also