Serenity: Abort closing of dialog in current Serenity

Created on 10 Oct 2017  路  2Comments  路  Source: serenity-is/Serenity

Hi all,

is it possible to cancel a closing Dialog - means to Pop up a Dialog to the user (e.g. in the onDialogClose event) and ask if he/she really wants to Close the Dialog and if they click on "no" then Abort the closing Action and Keep the Dialog continually open?

The Goal is to possibly catch all the closing Input vectors (pressing escape, pressing the update button, clicking on the X in the right corner, etc.) at one place and then present the user with the choice to Close the dialog or continue.

If this is possible, how do I catch this (in the onDialogClose Event?) and how to cancel the Close Event?

Here in this issue there is something similar but at any choise of the user, the Dialog gets still closed (although the user has the possibility to save the data in the Dialog).

Thanks for any hint in this regard.

With Kind regards,

John

Most helpful comment

Hi Estrusco,

thanks for this Input. I was already "lurking" arround this function but didn't get it until your confirmation of this.

For reference if anybody ever needs this:

Here the Code (I have just added this function in the DialogUtils.ts):

export function dialogCloseConfirmation(element: JQuery) {
        element.bind('dialogbeforeclose', function (e) {
            if (!Serenity.WX.hasOriginalEvent(e)) {
                return;
            }
            e.preventDefault();
            Q.confirm('Do you really want to close this dialog?',
                () => { element.dialog().dialog('close');},
                {
                    onNo: function () {
                        return;
                    }

                });
        });
    }

and in the xyzDialog.ts, use it like this:

DialogUtils.dialogCloseConfirmation(this.element);

With Kind regards,

John

All 2 comments

See pendingChangesConfirmation function in https://github.com/volkanceylan/Serene/blob/master/Serene/Serene.Web/Modules/Common/Helpers/DialogUtils.ts and CustomerDialog in Serene for an example of how bind 'dialogbeforeclose' event to your form.

Hi Estrusco,

thanks for this Input. I was already "lurking" arround this function but didn't get it until your confirmation of this.

For reference if anybody ever needs this:

Here the Code (I have just added this function in the DialogUtils.ts):

export function dialogCloseConfirmation(element: JQuery) {
        element.bind('dialogbeforeclose', function (e) {
            if (!Serenity.WX.hasOriginalEvent(e)) {
                return;
            }
            e.preventDefault();
            Q.confirm('Do you really want to close this dialog?',
                () => { element.dialog().dialog('close');},
                {
                    onNo: function () {
                        return;
                    }

                });
        });
    }

and in the xyzDialog.ts, use it like this:

DialogUtils.dialogCloseConfirmation(this.element);

With Kind regards,

John

Was this page helpful?
0 / 5 - 0 ratings

Related issues

JohnRanger picture JohnRanger  路  3Comments

chintankukadiya18 picture chintankukadiya18  路  3Comments

Akarsh03 picture Akarsh03  路  3Comments

stepankurdylo picture stepankurdylo  路  3Comments

Shraddha996 picture Shraddha996  路  3Comments