Before closing the SimpleModal dialog box

Question

I am using SimpleModal ( http://www.ericmmartin.com/projects/simplemodal/ ) and I have a form that appears in the dialog box. What I want to do is to get confirmation when the user tries to close the dialog box (either by escape or by clicking on the close icon), and asks if they really want to close it without saving the form data, I tried the following:

onClose: function (dialog) {
    if (confirm('Are you sure you want to close without saving?')) {
        $.modal.close();
    }
}

But it only works once. If you click the Cancel button, it will not be closed later, which makes sense. Anyone have a suggestion or solution? Any help would be greatly appreciated. :)

Answer 1

I looked at the source SimpleModalfor you, and what you want to do cannot be done with their code. That's why:

Before calling your custom callback, onCloseit calls the following:

s.unbindEvents();

Which effectively says: "This check box closes whether you like it or not." This is not like a regular callback that you can cancel.

I would recommend using jQuery UI Dialog instead , which you should find is super easy to implement this functionality using their beforeclosecallback. You just use:

beforeclose: function(){ 
    return confirm('Are you sure you want to close without saving?')
}

Answer 2

I got this working using what jerone tried but also rewrote events:

onClose: function (dialog) {
    if (confirm('Are you sure you want to close without saving?')) {
        $.modal.close();
    }else{
        this.occb = false;
        this.bindEvents();
    }
}

, . , . , , js.

Answer 3

I also looked at the source, and when the event runs onclosed, the flag is occbon.

What you can try (I have not tried it yet) is to override this occbwhen passing the variable this:

onClose: function (dialog) {
    if (confirm('Are you sure you want to close without saving?')) {
        $.modal.close();
    }else{
        this.occb = false;
    }
}

Hope this helps.