jQuery dialog confirm delete does not trigger the delete

Question

I have the following function to be called when I click a delete button (I have got a list of user with their related id and delete button based on their id to be deleted) which works fine:

function confirmDelete(name, deleteURL) {
    var description = "Delete " + name + "?";
    var check = confirm(description);
    if(check == true) {
        self.location = deleteURL;
    } else {
        window.location.deleteURL = deleteURL;
    }
    return false;
}

Then I decided to override the confirm function and turn it to a jquery dialog like the following:

$(function () {

    window.confirm = function (message) {
        $('#overrideAlert').text(message).dialog({
            resizable: false,
            height: 140,
            modal: true,
            buttons: {
                "Delete item": function () {
                    $(this).dialog("close");
                },
                Cancel: function () {
                    $(this).dialog("close");
                }
            }
        });
    };
});

When I click the delete link, the jQuery dialog pops up properly but when I click the 'delete item' it does not actually trigger the delete, it only close the dialog (as it should). what I m missing here is probably there should be way (same as the JavaScript confirm to trigger the delete when ok is selected) to delete my item. Can anyone please let me know what am I missing here? Thanks.

The problem is you need to first trigger the confirmDelete to get the second part for the conversion to the jquery dialog?! — ComeRun, May 01 '13 at 06:41
@jahroy its simple. the second scripts is there to override any confirm to jquery dialog. confirmDelete needs to be called first, thats what I mean — ComeRun, May 01 '13 at 06:48
@jahroy yeah I have got hundreds of pages using alert so I thought I'd re-define instead of a big change — ComeRun, May 01 '13 at 06:49
Ok. That makes sense. Pardon me for misreading the question. I'm re-reading it now. At first glance it looks like you're question is going to be "_how do I get a return value from my jQuery dialog_". When I google that I find [this](http://stackoverflow.com/q/6049687/778118) and [this](http://stackoverflow.com/a/8740191/778118)... — jahroy, May 01 '13 at 06:52

jahroy · Accepted Answer · 2013-05-01T07:19:22.677

1

You might have to re-write confirmDelete() to make this work.

Maybe something like this:

function confirmDelete(name, deleteURL) {
    var description = "Delete " + name + "?";
    confirm(description, doDelete, deleteURL);
}

function doDelete(check, deleteURL) {
    if(check == true) {
        self.location = deleteURL;
    } else {
        window.location.deleteURL = deleteURL;
    }
}


$(function () {

    window.confirm = function (message, callbackFunc, funcArg) {
        $('#overrideAlert').text(message).dialog({
            resizable: false,
            height: 140,
            modal: true,
            buttons: {
                "Delete item": function () {
                    $(this).dialog("close");
                    if ($.isFunction(callbackFunc)) {
                        callbackFunc(true, funcArg);
                    }
                },
                Cancel: function () {
                    $(this).dialog("close");
                    if ($.isFunction(callbackFunc)) {
                        callbackFunc(false, funcArg);
                    }
                }
            }
        });
    };
});

Better yet you could pass a callback function to your new confirm function...

edited May 01 '13 at 07:19

answered May 01 '13 at 06:57

jahroy

22,322
9
59
108

That's great. Sorry I misread the question at first... Also, I started to edit the question so that a callback function was passed to the _new_ confirm function, but since you already accepted the answer, I'll just leave it as is... – jahroy May 01 '13 at 07:00
Can you please do your change? ;) – ComeRun May 01 '13 at 07:03
Sure. I'll put up what I think might work and let you see if it does ;-) – jahroy May 01 '13 at 07:08
Just realized that there is problem passing the deleteURL as well! any suggestion?! – ComeRun May 01 '13 at 07:11
1

I suppose you could add it as another parameter... I'm not sure how questionable this strategy is. Looking at the [MDN documentation](https://developer.mozilla.org/en-US/docs/DOM/window.confirm) confirm only takes one parameter, so maybe it's harmless to add a couple for your purposes. In that case you could just add the _deleteUrl_ before or after the callback function. – jahroy May 01 '13 at 07:17

score 0 · Answer 2 · answered May 01 '13 at 07:30

The approach I take to this is to have the .confirm function return a promise.

var confirm = function() {
    var def = $.Deferred();
    ...
        "Delete Item": function() {
            $(this).dialog('close');
            def.resolve();
        },
        "Cancel": function() {
            def.reject();
        }
    }
    return def;
}

confirm("prompt").done(function() {
     console.log('success');
}).fail(function() {
     console.log('cancel');
});

jQuery dialog confirm delete does not trigger the delete

2 Answers2