How to return boolean from confirm dialog plugin?

Question

In JavaScript, they have confirm dialog which returns true or false, upon clicking yes or no button.

if (confirm('Your question')) { 
   // do things if OK
}

But it is not customizable and can be stopped upon clicking the check box in the popup.

So I want to use JQuery confirmation or dialogue plugin. However plugin I found, does not returns true or false. It comes with button functions and I can't return true or false from the button functions.

Is there any way to return variable like Boolean in jQuery confirm ?

Answer 1

$('.dialog button').click(function () {
  if($(this).attr('class') == 'true') {
    $('p').text('Ok was clicked');
  } else {
    $('p').text('Cancel was clicked');
  }
});

.dialog {
  background-color: #cecece;
  border: 1px solid #000;
  padding: 1%;
  font-family: 'Segoe UI';
  text-align: center;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="dialog">
  <button class="true">Ok</button>
  <button class="false">Cancel</button>
</div>
<p></p>

Answer

You can determine which button was clicked then. For example a dialog has buttons with class, of either true or false. Like

<div class="dialog">
   <button class="true">Ok</button>
   <button class="false">Cancel</button>
</div>

you can handle the jQuery for this as

$('.dialog button').click(function () {
   if($(this).attr('class') == 'true') {
      // OK was clicked
   } else {
      // cancel was clicked.
   }
}

This was only one approach, you can even use data- tags to add more functions. But I don't think there are any booleans in JavaScript (jQuery is library of JavaScript; it would only have features JavaScript has).

You can try the above Code to test it. It has basic style too, and the buttons are used to determine the user selected true or false thing. It is a custom confirm box. jQuery handles it, and then on a condition it does the job to write the value in the p.

Answer 2

It can't return the value, but there is a workaround:

var returnValue;

$("#confirmdialog").dialog({
    modal: true,
    buttons: [{
        text: "Yes",
        "id": "btnOk",
        click: function () {
            returnValue = true;
        },
    }, 
    {
        text: "No",
        click: function () {
            returnValue = false;
        },
    }],
});

And then check the returnValue

if(returnValue){
}