How to run JavaScript code when a form is being reset?

Question

I know we can attach a handler to the form onsubmit... But how can we add a handler to the form reset event? (usually when clicking on <input type="reset">)

Or... Maybe there is no such event... So the question becomes on how to work-around that?

(right now, I want to run a handler after the reset event; but someday I might need to run before the reset event)

Answer 1

According to w3schools, the <form> tag supports an onreset event.

Onreset fires before the actual resetting of the form; there doesn't appear to be any event for after resetting. I tested to see if the reset would fire an onchange event for the inputs whose values are reset, but it does not appear to.

A workaround for doing something after resetting might be to set a flag on reset, and then use the onblur event of the reset button (so after you reset, it would run the next time you click on something else). An alternate workaround, of course, is to trigger a setTimeout so that your script would run a short time after the reset. Either one is a bit of a hack, I'm afraid.

Answer 2

Have you tried

<form onreset="action()">

Seems to work for me for running the script before resetting the form. As for after ... I don't think it's supported, possibly a setTimeout would do the trick.

Answer 3

You can use the "reset" event of the "form" element

<form action="form_action.php" onreset="return confirm('Do you really want to reset the form?');">

....

</form>