-1

I have a link with some parameter which loads another page like:

    <a href="/cart.php?action=save&amp" class="prevent_doubleclick">save</a>

When someone clicks on the link, it will change the text from save to please wait....

Meanwhile the browser is loading the /cart.php page but I'm still on the current page which takes around 3 to 5 seconds and the user is able to click 10 more times on the link which will result in sending the parameters many times and each time a new item is saved.

I can't disable the click event with .one() or return false or unbind since the user triggers the click the first time by actually clicking on the link and I trigger a second click event after 2 seconds by code. So if I disable the click event after the user has clicked the link then my $('.element').trigger('click'); won't work anymore.

Any ideas on how this is doable?

Ali Esmailpor
  • 1,209
  • 3
  • 11
  • 22
DevMan
  • 538
  • 1
  • 5
  • 25
  • 2
    Why do you do `$('.element').trigger('click');` after a couple seconds instead of letting the click event operate normally? – CertainPerformance Feb 01 '21 at 15:02
  • @CertainPerformance because it has check some data and do some other work. – DevMan Feb 01 '21 at 15:04
  • I think your answer is already exist on this page.. [ How to prevent a double-click using jQuery?](https://stackoverflow.com/questions/11621652/how-to-prevent-a-double-click-using-jquery) – John Feb 01 '21 at 15:04
  • 1
    @DevMan Can you explain why a single click can't manage that? It's not clear what your need for that logic is at the moment – CertainPerformance Feb 01 '21 at 15:05
  • @John NO. There it disables the button after the first click. Exactly what I didn't want. – DevMan Feb 01 '21 at 15:06
  • @DevMan So you want the link/button click to do one thing the first time it is clicked and then another thing the 2nd time it is clicked (while the first click action hasn't resolved)? Is that what you're looking for? – raddevus Feb 01 '21 at 15:07
  • @CertainPerformance sorry but it is how it is. Trust me I have thought about it alot but it's not a simple shop app but some kind of other app and I can't enclose all aspects of it. Many people are trying to find a solution already. We can't change the logic and have to find a solution as it ist. – DevMan Feb 01 '21 at 15:08
  • @raddevus No. After it's clicked, it takes some time for the new page to load but I'm still on the old page. So the user can click 10 more times on the link. Which will send the data multiple times. – DevMan Feb 01 '21 at 15:11
  • 1
    '*the browser is loading the /cart.php page but I'm still on the current page which takes around 3 to 5 seconds*' That is the issue you should be looking to solve. Anything around preventing double clicks is a band-aid to the actual problem of a painfully slow server. – Rory McCrossan Feb 01 '21 at 15:11
  • @RoryMcCrossan This is all clear to me but in certain situations you have to find a temp solution. – DevMan Feb 01 '21 at 15:13
  • Doesn't just moving the onclick code to client-side function (JavaScript) allow you to separate out exactly what you want to do? Instead of firing the request for the link (/cart.php?action=save&amp) directly you can move it to a JS function, do the work you want to do (disable the button or whatever) then fire the request for the link. Doesn't that solve the issue? – raddevus Feb 01 '21 at 15:20

2 Answers2

0

I would suggest:

target.addEventListener(type, listener [, options]);

with the once option

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

I hope I could help

TsgabiXD
  • 140
  • 10
0

Rather than triggering the click the second time, you could change the window.location, and set a flag when clicked:

let clicked = false;
$('.prevent_doubleclick').on('click', (e) => {
  e.preventDefault();
  if (clicked) return;
  clicked = true;

  /* do whatever stuff you need to do here */

  setTimeout(() => {
    window.location.href = '/cart.php?action=save&amp';
  }, 2000);
});
CertainPerformance
  • 356,069
  • 52
  • 309
  • 320