How to prompt user before close of editor modal?

jibranb

Hello. I would like to display a prompt to user before close of editor modal.

I've tried attaching to the editor "close" event, but modal closes right away.

    editor.on( 'close', function ( e ) {
        e.preventDefault();     
        return confirm( 'Are you sure you want to close?' );
    });

Any help greatly appreciated.

jibranb

I figured it out! Had to add a cancel button and my own handler to the modal form.

$( '#contacts_list' ).DataTable( {
...
        buttons: [
            { 
                extend: "create", 
                editor: editor,
                formButtons: [
                    { label: 'Cancel', fn: function () { 
                        if( confirm( 'Are you sure?' ) ) {
                            this.close();
                        }
                    } },
                    { label: 'Create', className: 'btn btn-primary', fn: function () { 
                        this.submit();
                    } }
                ]
            },
            { 
                extend: "edit",
                editor: editor,
                formButtons: [
                    { label: 'Cancel', fn: function () { 
                        if( confirm( 'Are you sure?' ) ) {
                            this.close();
                        }
                    } },
                    { label: 'Update', className: 'btn btn-primary', fn: function () { 
                        this.submit();
                    } } 
                ]
            },
            { extend: "remove", editor: editor }
        ],
...
    } );

Then I had to hide the close button (x) in the modal header via CSS (SASS) so it wouldn't circumvent the new handler. Maybe there's a better way to do this part--ideas welcome.

.DTE_Header {

    button.close {
        display: none;
    }

}

allan

Thanks for posting back - that looks good. You could also use the onBlur option of form-options which is cancellable.

Allan