Javascript DOM oninvalid Event

Introduction

Alert some text if an input field is invalid:

If you click submit, without filling out the text field, an alert message will occur.

View in separate window 

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>
<script>
function test(){// w ww.  jav  a2 s.c o m
   document.getElementById("demo").innerHTML = "You must fill out the form!";
}


</script>
<form action="/action_page.php" method="get">
  Name: <input type="text" 
  oninvalid="test();" name="fname" required>
  <input type="submit" value="Submit">
</form>
</body>
</html>

The oninvalid event occurs when a <input> element is invalid.

For example, the input field is invalid if the required attribute is set and the field is empty.

Bubbles: No
Cancelable: Yes
Event type: Event
Supported HTML tags: <input>



PreviousNext

Related