How do I perform an action immediately after an <input type="reset"/> has already reset the form elements?
4 Answers
Try :
<input type="reset" onclick="return resetForm();"/>
function resetForm(){
setTimeout(function(){
// do whatever
}, 50);
return true;
}
5 Comments
gilly3
+1 for delaying the function to fire after the form was reset.
Gary
For every browser I tested, setting the timeout to 0 was sufficient.
Patricio Rossi
Looks like this is the only way to run something really after the reset
Felipe Quirós
actually, you don't need the 50 ms, just the timeout is deferring this process to the end of the js processing pile.
logi-kal
The answer could be improved by adding some explanation about why it works.
Forms have a reset event that you can listen for.
<script>
function resetHandler() {
// code
}
</script>
<form ... onreset="resetHandler();">
</form>
Of course, it's bad practice to add javascript handlers this way, so you'd want to use .addEventListener/.attachEvent or jQuery.bind(), but you get the idea.
2 Comments
Eugene Kuzmenko
resetHandler runs before the form is reset, not after!
Patricio Rossi
The questions is about the execution of a function AFTER the reset is done, not before, not at the same time. this answer is not correct.
Write code/events which you wanted to call in middle of this function. I have tested this. Working good.
$(document).ready(function() {
$("input:reset").click(function() { // apply to reset button's click event
this.form.reset(); // reset the form
// call your functions to be executed after the reset
return false; // prevent reset button from resetting again
});
});
1 Comment
Michael Plotke
The reset function fails when a form control has the name or id 'reset'
You always can use jQuery, or do some tricks with form reset event itself.
onclickhandler to the input?