Form onreset Event after the form reset

Question

Here's a sample form:

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Form onreset</title>
</head>

<body>
    <form onreset="myFunction();">
        <input type="text" name="fname">
        <input type="text" name="lname">
        <button type="reset" value="Reset">Reset</button>
    </form>
    <script>
        function myFunction() {
            alert("The form was reset!");
        }
    </script>
</body>

</html>

When I click the reset button, the form onreset event fires first, i.e. the alert message appears before resetting the form fields. How can it happen after the form fields rest?
I also tried the following to no avail:

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Form onreset</title>
</head>

<body>
    <form>
        <input type="text" name="fname">
        <input type="text" name="lname">
        <button type="reset" value="Reset" onclick="myFunction();">Reset</button>
    </form>
    <script>
        function myFunction() {
            alert("The form was reset!");
        }
    </script>
</body>

</html>

Possible duplicate of http://stackoverflow.com/questions/8152904/call-a-function-after-form-reset — talemyn, Jan 28 '14 at 19:48

score 3 · Answer 1 · answered Jan 28 '14 at 20:00

3

Try it

function myFunction() {
        setTimeout(function () {
            alert("The form was reset!");}, 100); 

        }

answered Jan 28 '14 at 20:00

Kaptan

336
2
11

Form onreset Event after the form reset

1 Answers1