feat: $ionicPopup.prompt should support Enter and Esc

[gregallensworth]

Type: feat

Platform: all

$ionicPopup.prompt does not support the Enter and Escape key.

Enter is triggered by the Go/Enter button on the software keyboard, and expected behavior would be to click the OK button for you.

Escape is absent on software keyboards, but is useful for testing on desktop browsers. Support for Escape should be little trouble to implement and no additional overhead, once the keypress handling framework is in place. Expected behavior of pressing Escape, would be to click the Cancel button.

[gregallensworth]

Commits ddff006 and175218f together, bring a new development to $ionicPopup in general: the keyPressHandlers parameter to showPopup(). This is a mapping of keyCode numbers onto handlers, each handler being passed a reference to the Popup.

This is specifically intended to trigger the OK/Cancel buttons, but hypothetically could perform other actions as well.

$ionicPopup.prompt() now supports hitting Enter/Go and Escape, to trigger the OK and Cancel buttons respectively. The underlying code in showPrompt() is as follows:

    var keyPressHandlers = {
        "13": function (popup) { // 13 = Enter = OK
            var button = popup.scope.buttons[1];
            var tapper = popup.scope.$buttonTapped;
            var fclick = new MouseEvent('click', { 'view':window, 'bubbles':true, 'cancelable':true });
            tapper(button,fclick);
        },
        "27": function (popup) { // 27 = Esc = Cancel
            var button = popup.scope.buttons[0];
            var tapper = popup.scope.$buttonTapped;
            var fclick = new MouseEvent('click', { 'view':window, 'bubbles':true, 'cancelable':true });
            tapper(button,fclick);
        }
    };

    return showPopup(extend({
      keyPressHandlers: keyPressHandlers,
      etc other options...

[gregallensworth]

Commit bdf7a3a adds keypressHandlers to showAlert() and showConfirm() so these dialog types also support a keypress to dismiss them. Very useful under desktop testing, but not useless under mobile if your keyboard stays open even when a text input is not focused (Windows).

[gregallensworth]

Commit 48c20c7 binds the keypress listener to window instead of popup.element[0] In the case that you do not have a text input focused (Alert, Confirm) the popup itself likely does not have focus, and binding events to window makes them effective.

[Hussain-AboAlamal]

could you please supply the final version of code

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.