0

How can I add a delay on the return statement of a confirm box? I have tried using setTimeout but it doesn't work.

My idea is to display a modal for 5 seconds and then take the user to the signout page.

<a href='signout.cgi?id=$key' onclick='singOutConfirm()'> Sign Out</a>

 function singOutConfirm(){
      var c = confirm("Confirm Sign Out!");
      var modal = document.getElementById('myModal'); 
      console.log(c);
      if(c == true ) {  
         setTimeout(function(){ 
            return c;
        }, 5000); 
      } 
      return c;
Riddhi
  • 201
  • 1
  • 10
Pedro
  • 1,440
  • 2
  • 15
  • 36
  • 2
    I think just remove that last `return c;` because it's running synchronously, so the timeout isn't working as you're expecting. Also, use `===` instead of `==` in javascript, actually, you dont even need an equals, you can just say `if (c) {` because it's truthy – Abdul Ahmad Jul 24 '18 at 23:09
  • 2
    You can't delay the function with a timeout. It will run until finished. And then the callback will fire. You need to put code in the callback for `setTimeout` that does what you want instead of just returning. – Mark Jul 24 '18 at 23:17
  • Possible duplicate of [Wait 5 seconds before executing next line](https://stackoverflow.com/questions/14226803/wait-5-seconds-before-executing-next-line) – Heretic Monkey Jul 24 '18 at 23:44

1 Answers1

0

You sir, need a Promise.

But two things

  1. They are not supported in ie https://caniuse.com/#feat=promises. You might want to use Babel or Typescript to polyfill them. If you don't want to compile you JS consider using Bluebird for promises.
  2. Specifically in your example you are expecting to navigate to a URL on click. You are going to want to change the browsers location when the promise resolves. window.location.href = 'signout.cgi?id=$key'

function signOutConfirm (e) {
  e.preventDefault()
  const c = confirm("Confirm Sign Out!");
  const modal = document.getElementById('myModal'); 
  console.log(c);
  if(c) {  
    return new Promise((resolve) => {
      setTimeout(() => {
        window.location.href = 'signout.cgi?id=$key'
        resolve(c)
      }, 5000); 
    })
  } 
  return Promise.resolve(c);
}

console.time('Signing out')
signOutConfirm()
  .then(c => {
    console.timeEnd('Signing out')
    console.log(c)
  })
stwilz
  • 2,226
  • 2
  • 21
  • 24
  • For something this simple, adding all of that promise code is overkill. The `setTimeout` function with the `window.location.href` setter in the function is all that is needed. – Heretic Monkey Jul 24 '18 at 23:52
  • @HereticMonkey correct. To specifically solve the issue @pedro has we don't need to use a `promise`. He did however specify in his question "add a delay on the return statement of a confirm box" and going from the example provided he was a little unsure of how to `return` his delayed value. So hopefully by giving a `promise` example it should shed a little light on the issue for him :) – stwilz Jul 25 '18 at 01:55