Pause function execution until another function returns

I am wanting to replace Magento's implementation of the alert() and confirm() dialog boxes. While the alert() replacement was trivial, I am unsure of how to handle the confirm() dialog. Is there a way to prevent JavaScript from continuing until a function is returned? Will this require looping that could crash a browser?

So for example, I need to replace code like this:

<form action="" method="POST">
   <input type="submit" onclick="return confirm('Are you sure?');" value="Delete">
</form>

with...

<form action="" method="POST">
   <input type="submit" onclick="return myCustomConfirm('Are you sure?');" value="Delete">
</form>

Or other scenarios such as:

<script>
   var delete = confirm('Are you sure?');
   if (delete) {
       doSomething();
   }
</script>

with...

<script>
   var delete = myCustomConfirm('Are you sure?');
   if (delete) {
       doSomething();
   }
</script>

In both scenarios, myCustomConfirm() will open a Bootstrap modal where the user must click "Okay", "Cancel", or close the modal. The value returns true if "Okay" and false if otherwise.

I don't want to do callbacks as that will cause more refactoring than desirable. Is this possible to do in another way?

Thanks!

Solution

It is not possible. You cannot write a JavaScript function that blocks execution, gathers user input and returns a value based on user input. The only way to block execution and wait for user input is to use confirm.

You have to refactor your code to use callbacks if you want to use custom dialogs.

See Emulate Javascript 'alert' blocking nature