1

SOLUTION IN THE END OF QUESTION

I would like to show a confirmation modal asking if the user really wants to do a thing and depending of result it will continue the code execution.

I'm reading the "Confirm, Alert and Error messages" part of this doc to do this: Link to the DOC

The .js and .css files you can find here and here if you want to test

But, in this part of my code I must check if a variable it's TRUE before showing the confirmation modal:

if (verifyPermission === true){    
        FLUIGC.message.confirm({
            message: "Would you like to allow this?",
            title: 'Without permission',
            labelYes: 'Yes',
            labelNo: 'No'
            }, function (result, el, ev) {                   
                if (!result) {
                    return; //Not allowed, so here must cancel the execution
                }
            }
        });
        //I want to the application stops here until the user confirm
}

//The rest of code is here below

I would like that if verifyPermission it's true it will be asked the confirmation. If the user answer "No" then the code must stop running.

But, what is happening is that the confirmation question it's showing but the rest of code is executing without waiting the confirmation.

I can't put the rest of code inside of function(result, el, ev) because it's a lot of code and i think that will have code replication. And I don't know if putting the rest of code in a function will be a good pratice.

Please, can you tell me if is there a right way to do this?

SOLUTION - USE JAVASCRIPT ASYNC FUNCTION

I put the word "async" before the function that checks the verifyPermission. And I left the code like this:

async function myFunc() {
    if (verifyPermission === true){    
            var result = await confirmPermission();                
            if(!result){
                    return;
            }
    }
    // rest of code here
}

And I created this function:

function confirmPermission(){

        return new Promise(resolve => {
            FLUIGC.message.confirm({
                message: "Would you like to allow this?",
                title: 'Without Permission',
                labelYes: 'Yes',
                labelNo: 'No'
            }, function (result, el, ev) {            
                resolve(result);
            });
        }); 
    }
WitnessTruth
  • 539
  • 2
  • 9
  • 27
  • Possible duplicate of [Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference](https://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron) – Ivar Aug 10 '18 at 14:47
  • The function is a callback... so therefore it should handle the case and belong there. You can avoid replication by further refactoring into functions – Attersson Aug 10 '18 at 14:48
  • Yeah, put the rest of the code in the callback, that's what it's for. If you're concerned about duplicating code, put the rest of the code in a separate function and call that function from inside the callback. – Daniel Beck Aug 10 '18 at 15:10

2 Answers2

0

Put your code inside the callback.

if (verifyPermission === true){    
    FLUIGC.message.confirm({
        message: "Would you like to allow this?",
        title: 'Without permission',
        labelYes: 'Yes',
        labelNo: 'No'
        }, function (result, el, ev) {                   
               if (!result) {
                   return; //Not allowed, so here must cancel the execution
               else{
                //your code here
               }
            }
        }
    });
}
S. Stumm
  • 290
  • 1
  • 9
-1

Put async before the function, and make a promise chain or something. This makes sure the code runs in sequential order.

Source: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

EDIT: I'm actually not too familiar with this so it is better is read the source and take a good look at it.

mathmaniac88
  • 630
  • 7
  • 22