jQuery confirm box that pauses script execution

Question

I'm looking for a jquery/nice looking alternative to the standard dialog box. jQUery UI has a nice one, but it doesn't pause script execution to wait for the response like confirm() does. The demo below is supposed to display two divs that display the choice of the preceding confirm box, but the jquery dialog box doesn't cause the script to wait.

http://jsfiddle.net/EvilAmarant7x/r7Ur5/

I specifically need something that causes the script to pause.

Thanks

Answer 1

Unfortunately, this is not possible if you use a custom confirm/modal window. You're going to have to use callbacks or opt to use the new deferred object introduced with 1.5.

Using deferred would look something like this:

var dfd = new $.Deferred();
$("#dialog-confirm").dialog({
  resizable: false,
  height: 140,
  modal: true,
  buttons: {
    Proceed: function() {
        dfd.resolve('Success!');
        $(this).dialog("close");
    },
    Cancel: function() {
        dfd.reject('Uh-oh!');
        $(this).dialog("close");
    }
  }
});

dfd.then(function() {
  // perform next action when user clicks proceed
});

dfd.fail(function() {
  // perform some action when the user clicks cancel
});

Answer 2

Your using the dialog in the wrong way

you should do it like this

 $("#dialog-confirm").dialog({
resizable: false,
height: 140,
modal: true,
buttons: {
    Proceed: function() {
          call_true_function();
        $(this).dialog("close");
    },
    Cancel: function() {
        call_false_function()
        $(this).dialog("close");
    }
}
});

or something similar

** EDIT **

so something like this ?

count = 0;
$("#dialog-confirm").dialog({
resizable: false,
height: 140,
modal: true,
buttons: {
    Proceed: function() {
          proceed();
        $(this).dialog("close");
    },
    Cancel: function() {
        $(this).dialog("close");
    }
}
});

function proceed(){
    if (count != 10){
        $("#dialog-confirm").dialog('open');    
    }else{
        $('body').append("<div>Yes was selected " + count + " times!</div>");
    }
}