javascript - avoid multiple clicks on a div -
it's sthg simple, still didn't find solution, avoid multiple clicks on button, before finishing ajax call.
here tried :
<button id="btn_pay"></button> $("#btn_pay").click( function() { $('#btn_pay').prop('disabled', true); stripe.card.createtoken(form, striperesponsehandler); }); var striperesponsehandler = function(status, response) { $.ajax({ type: "post", success: function(data){ alert("success"); },complete:function(){ //we re-enable button $('#btn_pay').prop('disabled', false); } });
problem : if click several times on button, many alerts appear, it's button still active, , many ajax call done instead of jsut 1 @ time..
any idea ?
you can control simple variable:
<button id="btn_pay"></button> var disabled = false; // global var control button state $("#btn_pay").click( function() { if (disabled) { return; } stripe.card.createtoken(form, striperesponsehandler); disabled = true; // button blocked }); var striperesponsehandler = function(status, response) { $.ajax({ type: "post", success: function(data){ disabled = false; // release button lock alert("success"); },complete:function(){ disabled = false; // release button lock },fail: function(){ disabled = false; // when fail, need release lock } }); }
other solutions event handlers may work too, simpler way implement feature.
Comments
Post a Comment