How to catch ESC in event in JQuery Dialog?

Question

Is it possible to have a custom handler for ESC key on the JQuery Dialog?

Mutualize

one is already there called closeOnEscape: false – Halfbaked

@DipeshParmar that just turns off the default escape handler, it doesn't add a custom handler. – Politics

Answer 1

Yes, it's possible.

Set the closeOnEscape option to false and register your own keydown handler on the .ui-dialog element within the dialog's dialogcreate handler.

$(element).dialog({
    create: function() {
       $(this).closest('.ui-dialog').on('keydown', function(ev) {
           if (ev.keyCode === $.ui.keyCode.ESCAPE) {
               ...
           }
       });
       ...
    },
    closeOnEscape: false,
    ...
});

See http://jsfiddle.net/alnitak/EbnZr

Politics

Answer 2

I use another way:

$(element).dialog({

    beforeClose: function(event) {
        if (event.keyCode === $.ui.keyCode.ESCAPE) {
            // ...
            return false;
        }
    }

});

Romonaromonda

Answer 3

$(selector-for-dialog).keyup(function(e) {
    // ESC key
    if ( e.keyCode === 27 ) {
        // custom action
    }
});

Animality