Javascript Form How to - Handle reset and submit Event Handlers

Question

We would like to know how to handle reset and submit Event Handlers.

Answer


<!--   w  w  w  .  j  ava2s . c  o  m-->
<html> 
<head> 
<script type="text/javascript"> 
function allowReset() { 
    //return window.confirm("Go ahead and clear the form?"); 
    console.log("reset");
} 
function allowSend() { 
    //return window.confirm("Go ahead and mail this info?"); 
    console.log("send");
} 
</script> 
</head> 
<body> 
<form method="POST" 
      enctype="text/plain" 
      action="mailto:a@b.com" 
      onreset="return allowReset()" 
      onsubmit="return allowSend()"> 

    Enter your first name:
    <input type="text" name="firstName" id="firstName"/> 
    Enter your last name:
    <input type="text" name="lastName" id="lastName"/>
    Enter your address:
    <input type="text" name="address" id="address"/>
    Enter your city:
    <input type="text" name="city" id="city" />
    <input type="radio" name="gender" id="gender1" checked="checked" />
    Male 
    <input type="radio" name="gender" id="gender2" />Female
    <input type="checkbox" name="retired" id="retired" />I am retired
    <input type="reset" /> 
    <input type="submit" />
</form> 
</body> 
</html>

The code above is rendered as follows: