Kendo UI Window Close Event: prevent window close

Question

We are creating a warning message for an app with various forms. In simple pages it's very easy, we just detect changes in form elements and if a user wants to unload the page we show them the warning message.

But... we also have some forms in Kendo Windows, the thing is that we need to show that same confirmation message if a user wants to close the window. This is the script we have now:

$('div:has(div[data-role="window"])').find('a:has(span.k-i-close)').live('click', function (e) {
    if (formHasChanged) {
        alert('pepe');
        return false;
    }
    return true;
});

The problem with that script is that it's not preventing the window from closing, the close event seems to be happening before our alert. This solution may work http://www.kendoui.com/forums/ui/window/new-event-onclosing.aspx, but our windows are created on the fly.

Does anyone have a clue of how to sort this out?

Thanks in advance!

Code were we wanted to insert this kendo thingy workaround:

var formHasChanged = false;
$('form.withWarningMessage').find('input,select,textarea').live('change', function () {
    formHasChanged = true;
    window.onbeforeunload = function () {
        if (formHasChanged) {
            return confirmWarningMessage;
        }
    };
    $('input:submit').live('click', function () {
        formHasChanged = false;
    });
});

Answer 1

It does not matter that you create the Windows on the fly. If you can create them then you can bind such handler. If the code which Alex Gyoshev shared is not fine.

You can bind a handler initially like this:

$("#window").kendoWindow({
    close:function(e){
        if (!confirm("are you sure?"))
        e.preventDefault();
    }
})

Share details about your setup, there should be a way to integrate one of these aproaches into your case.