Take appropriate action after confirmation dialog is clicked
<p>I have a confirmation dialog made with jQuery UI.<br>
I'm trying to take appropriate action after the users reaction (whether <code>yes</code> or <code>no</code>):</p>

<pre><code>$("button").click(function() {
  if (showDialog('Do you want to continue?')) {
    console.log("yes");
  } else {
    console.log("no");
  }
});

function showDialog(message) {
  var dfd = new $.Deferred();
  $("#dialog").dialog({
    modal: true,
    buttons: {
      "Yes": function() {
        dfd.resolve();
        $(this).dialog("close");
      },
      "No": function() {
        $(this).dialog("close");
      }
    }
  });
  $("#dialog").html(message);
}
</code></pre>

<p>In my case, I always get a <code>no</code>.</p>

<p>Also, the <code>no</code> appears even before a button is clicked. So I assume, this is asynchronous. Is there a way to prevent that, too?</p>

<p><a href="https://jsfiddle.net/fj66nbgu/1/" rel="nofollow">Here is a fiddle</a>.</p>