jQuery modal "Confirmation" popup

jQuery modal "Confirmation" popup


Hi All,

I wonder if anyone could help me in implementing a kind of "confirmation popup".

Here is what I'm trying to achieve:

Let's say my website consists of 2 columns. One of them contains a form (fields can be added dynamically) and the other one contains some buttons. Each of the buttons has a handler associated to it. However, some of the buttons, when clicked, cause reloading of the data in the form. So, if I don't save changes in the form and click on one of mentioned buttons, I lose my changes.

So, I want to implement a kind of popup that appears whenever any of those buttons is clicked (and of course there are unsaved changes in the form), informs me that I have unsaved changes in the form, lets me decide if I want to Continue/Cancel and depending on what I choose continues or stops execution of the button handler function.

I've tried to use modal dialog, but opening of a modal dialog obviously doesn't stop execution of javascript, so the button handler function executes independently of my decision in popup. In other words, I am not able to implement something like: "when I click 'Continue' in popup continue executing the button handler function but if I click 'Cancel' - stop execution".

The only way to do this I can think of at this point is to move all the logic from button handler functions to the function associated with 'Continue' button inside the modal dialog (I will have to pass event to the dialog).

Can anyone think of a possible solution?

Thanks a lot!


PS I hope I've explained it clear enough...