It is amazing how may people out there still apply the double click paradigm to web applications.
What is frustrating is that some of the most simple methods for preventing the double click stop ASP.Net from firing the appropriate click event when the page is posted back.
A while ago Evgeny posted an article on how to prevent double clicks on buttons in ASP.Net. This solution was a little code heavy for my liking and so after a bit of playing around i came up with this simple jQuery solution.
That is where this little jQuery script come in. When the user clicks an input with the class of ‘button’ we will apply an attribute to it so that the next time the user clicks it, the event wont fire again. Easy!
$(document).ready(function () {
//prevent double clicks
$(".button").click(function () {
if ($(this).attr("dblclick") != "true")
$(this).attr("dblclick", "true");
else
return false;
});
});
Related posts:
A bit simpler:
$(document).ready(function(){
$(‘.oncebutton’).one(‘click’, function() {
$(this).slideUp();
});
});
Unfortunately this solution does not take into account postbacks or page validation.
Thanks Doug. This was just a simple example on how to prevent the double click.
You could easily add the validation call within here and if there are no issues then prevent a second click.