jQuery UI dialog with boolean return - true or false

Question

I´m trying to do an replacement for the javascript confirm(). I have found the jquery dialog() function that can be fully customized. The problem is that i cant make it return true or false. Here is my code: ``` $('#delBox').dialog( { autoOpen: false, resizable: false, modal: true, closeOnEscape: true, width: 300, height: 'auto', title: 'Deletar registro', buttons: { "Ok": function () { return true; }, "Cancelar": function () { $(this).dialog("close"); return false; } }, open: function () { var buttonsSet = $('.ui-dialog-buttonset').find("button:contains('Ok')"); buttonsSet.attr("class", "ui-button ui-state-default"); $('.ui-dialog-titlebar-close span').empty(); $('.ui-dialog-buttonset').find("button:contains('Ok')").button({ text: false, icons: { primary: 'ui-icon-ok' } }); $('.ui-dialog-buttonset').find("button:contains('Cancelar')").button({ text: false, icons: { primary: 'ui-icon-cancel' } }); } }); ``` This only return an object before any option selected: ``` function deletar()…

Accepted Answer

jQueryUI dialog boxes can't return a `true` or `false` as they're shown on top of other content but without blocking execution.

The best you can do is:

make the box `modal` so that it hides the other content

supply callbacks to be used depending on which option is chosen.

For extra bonus points, you could create a `$.Deferred()` promise object and return that when you show the dialog. You can then `resolve` or `reject` that promise in the button event handlers.

This would give you clean separation between showing the dialog box, and performing the actions subsequently triggered by it:

```
function showDialog() {
   var def = $.Deferred();

// create and/or show the dialog box here
   // but in "OK" do 'def.resolve()'
   // and in "cancel" do 'def.reject()'

return def.promise();
}

showDialog().done(function() {
    // they pressed OK
}).fail(function() {
    // the pressed Cancel
});

// NB: execution will continue here immediately - you shouldn't do
//     anything else now - any subsequent operations need to be
//     started in the above callbacks.
```

jQuery UI dialog with boolean return - true or false

Solution

Problem