I'm trying to emulate the confirm() functionality with my own styled modal. I have a function with a callback:

function confirmChanges(callback) {

    function clickOkay() {
        callback(true);
    }

    function clickCancel() {
        callback(false);
    }
}

This section is where I need the confirmChanges function to return true/false:

if (unsavedChanges == true) {
    j$('.confirm').showModal();
    if (confirmChanges(function(result) {return result;})) 
    {
        // Do stuff and return true
    } 
    else 
    {
        return false;
    }
}

Here's my HTML I'm using for the modal:

<div class="warningpop confirm">

    <h3>Unsaved Changes!</h3>                         
    <a id="modalContinue" value="Continue" onclick="clickOkay();"/>  
    <a id="modalCancel" value="Cancel" onclick="clickCancel();"/>   

</div>

However when I click the buttons in the dialog I get the error "clickCancel() / clickOkay() is not defined".

How can I fix it so that it returns true or false depending on the button clicked?

I'm trying to emulate the confirm() functionality with my own styled modal. I have a function with a callback:

function confirmChanges(callback) {

    function clickOkay() {
        callback(true);
    }

    function clickCancel() {
        callback(false);
    }
}

This section is where I need the confirmChanges function to return true/false:

if (unsavedChanges == true) {
    j$('.confirm').showModal();
    if (confirmChanges(function(result) {return result;})) 
    {
        // Do stuff and return true
    } 
    else 
    {
        return false;
    }
}

Here's my HTML I'm using for the modal:

<div class="warningpop confirm">

    <h3>Unsaved Changes!</h3>                         
    <a id="modalContinue" value="Continue" onclick="clickOkay();"/>  
    <a id="modalCancel" value="Cancel" onclick="clickCancel();"/>   

</div>

However when I click the buttons in the dialog I get the error "clickCancel() / clickOkay() is not defined".

How can I fix it so that it returns true or false depending on the button clicked?

• javascript
• asynchronous
• callback

• 2 i guess it's because this both function are in scope of confirmChanges function. w3schools./js/js_function_closures.asp – Dhaval Chaudhary Commented Nov 24, 2016 at 12:16
• I'm trying to implement the functionality in this answer: stackoverflow./a/28245688/2087008 – user2087008 Commented Nov 24, 2016 at 12:19

1 Answer 1

Is this what you want or i got you wrong? Please feel free to query.

function getResponse(res, func) {
  
  if(res) {
    console.log(1);
    //do something
  } else {
    console.log(2);
    //do otherthing
  }
  
  /* If tou want to call some other function dynamically. */
  
  func();
}

function one() {
  console.log("calling function one");
}

function two() {
  console.log("calling function two");
}

<div class="warningpop confirm">

    <h3>Unsaved Changes!</h3>                         
    <a id="modalContinue" value="Continue" onclick="getResponse(true, one);">Yes </a>  
    <a id="modalCancel" value="Cancel" onclick="getResponse(false, two);">No </a>

</div>