html tutorial - oninvalid Attribute in HTML - html5 - html code - html form
Learn html - html tutorial - Oninvalid attribute in html - html examples - html programs
- The oninvalid attribute is triggers an event when a submittable <input> element is invalid.
- The required attribute describes that the input field must be filled out before submitting the form.
- The oninput attribute is an Event Attributes.
Syntax for oninvalid attribute in HTML:
<element oninvalid="script">Differences between HTML 4.01 and HTML5 for oninvalid attribute:
HTML 4.01
- HTML4 does not support oninvalid attribute.
HTML 5
- The oninvalid attribute is new in HTML5.
Applies To:
| Element | Attribute |
|---|---|
| All HTML elements | oninvalid |
Attribute Values:
| Value | Description |
|---|---|
| script | The script can run on oninvalid |
Sample Coding for oninvalid Attribute in HTML:
Tryit<!DOCTYPE html>
<html>
<body>
<p>WIKITECHY</p>
<form method="get">
Enter the text:
<input type="text" oninvalid="alert('Must fill out the form!');" required>
<input type="submit" value="Submit">
</form>
</body>
</html>Code Explanation for oninvalid Attribute in HTML:
- <form>tag is used to design a form for getting the input from the user.
- <input> tag is used to create a text box where the user can enter the data.
- oninvalid attribute is activate an alert box when the input value is invalid.
- required attribute defines the input field must be filled out before submitting the form.
- value attribute is used to set the submit button value as submit.
Output for oninvalid Attribute in HTML:
- The text box will be display when the page was load for getting the input from the user.
- The submit button used to submit the form-data.
- When the user clicked submit button with empty textbox alert box will be appear with the message of “Must fill out the form”.
Browser Support for oninvalid Attribute in HTML:
 |
 |
 |
 |
 |
|---|---|---|---|---|
| Yes | Yes | Yes | No | Yes |