diff --git a/web/pgadmin/about/static/js/about.js b/web/pgadmin/about/static/js/about.js index 5b711d4cc..c294ed65e 100644 --- a/web/pgadmin/about/static/js/about.js +++ b/web/pgadmin/about/static/js/about.js @@ -9,9 +9,9 @@ define( ['jquery', 'alertify', 'sources/pgadmin', 'sources/gettext', - 'sources/url_for', + 'sources/url_for','sources/utils', ], - function($, alertify, pgAdmin, gettext, url_for) { + function($, alertify, pgAdmin, gettext, url_for, commonUtils) { pgAdmin = pgAdmin || window.pgAdmin || {}; /* Return back, this has been called more than once */ @@ -43,8 +43,16 @@ define( build: function() { alertify.pgDialogBuild.apply(this); }, + hooks:{ + onshow:function(){ + var container = $(this.elements.footer).find('button:not([disabled])'); + commonUtils.findAndSetFocus(container); + }, + }, + prepare:function() { this.setContent(this.message); + }, }; }); diff --git a/web/pgadmin/static/js/alertify.pgadmin.defaults.js b/web/pgadmin/static/js/alertify.pgadmin.defaults.js index 206a3275a..84dfc12fe 100644 --- a/web/pgadmin/static/js/alertify.pgadmin.defaults.js +++ b/web/pgadmin/static/js/alertify.pgadmin.defaults.js @@ -8,8 +8,8 @@ ////////////////////////////////////////////////////////////// define([ - 'sources/gettext', 'alertify', 'jquery', -], function(gettext, alertify, $) { + 'sources/gettext', 'alertify', 'jquery', 'sources/utils', +], function(gettext, alertify, $, commonUtils) { alertify.defaults.transition = 'zoom'; alertify.defaults.theme.ok = 'btn btn-primary fa fa-lg fa-check pg-alertify-button'; alertify.defaults.theme.cancel = 'btn btn-secondary fa fa-lg fa-times pg-alertify-button'; @@ -263,7 +263,15 @@ define([ $(this.elements.commands.close).attr('aria-label', gettext('Close')); $(this.elements.commands.maximize).attr('aria-label', gettext('Maximize')); alertifyDialogResized.apply(this, arguments); - }); + let self = this; + + let cmds = Object.values(this.elements.commands); + $(cmds).on('keydown', 'button', (event) => { + if (event.shiftKey && event.keyCode == 9 && $(this).nextAll('button:not([disabled])').length == 0){ + let container = $(self.elements.footer); + commonUtils.findAndSetFocus(container.find('button:not([disabled]):last')); + } + }); }); this.set('onresize', alertifyDialogStartResizing.bind(this, true)); this.set('onresized', alertifyDialogResized.bind(this, true)); this.set('onmaximized', alertifyDialogResized); @@ -279,6 +287,15 @@ define([ this.__internal.buttons[i]['key'] = null; } } + let self = this; + + $(this.elements.footer).on('keydown', 'button', function(event) { + if (!event.shiftKey && event.keyCode == 9 && $(this).nextAll('button:not([disabled])').length == 0) { + // set focus back to first editable input element of current active tab once we cycle through all enabled buttons. + commonUtils.findAndSetFocus($(self.elements.dialog)); + return false; + } + }); }; alertify.pgHandleItemError = function(xhr, error, message, args) { diff --git a/web/pgadmin/static/js/alertify/dialog_wrapper.js b/web/pgadmin/static/js/alertify/dialog_wrapper.js index 5346b6a0d..e4c275f3a 100644 --- a/web/pgadmin/static/js/alertify/dialog_wrapper.js +++ b/web/pgadmin/static/js/alertify/dialog_wrapper.js @@ -60,14 +60,6 @@ export class DialogWrapper { this.pgBrowser.keyboardNavigation.getDialogTabNavigator($(alertifyDialog.elements.dialog)); const container = backform_tab.find('.tab-content:first > .tab-pane.active:first'); commonUtils.findAndSetFocus(container); - - $(alertifyDialog.elements.footer).on('keydown', 'button', function(event) { - if (event.keyCode == 9 && $(this).nextAll('button:not([disabled])').length == 0) { - // set focus back to first editable input element of current active tab once we cycle through all enabled buttons. - commonUtils.findAndSetFocus($(alertifyDialog.elements.dialog)); - return false; - } - }); } isNodeSelected(selectedTreeNode) { diff --git a/web/pgadmin/tools/grant_wizard/static/js/grant_wizard.js b/web/pgadmin/tools/grant_wizard/static/js/grant_wizard.js index eaaae760b..e5f50fc7d 100644 --- a/web/pgadmin/tools/grant_wizard/static/js/grant_wizard.js +++ b/web/pgadmin/tools/grant_wizard/static/js/grant_wizard.js @@ -13,13 +13,14 @@ define([ 'pgadmin.alertifyjs', 'pgadmin.backgrid', 'pgadmin.backform', 'pgadmin.browser', 'pgadmin.browser.node', 'tools/grant_wizard/static/js/menu_utils', + 'sources/utils', 'sources/nodes/supported_database_node', 'backgrid.select.all', 'backgrid.filter', 'pgadmin.browser.server.privilege', 'pgadmin.browser.wizard', ], function( gettext, url_for, $, _, Backbone, Alertify, Backgrid, Backform, pgBrowser, - pgNode, menuUtils, supportedNodes + pgNode, menuUtils, commonUtils, supportedNodes ) { // if module is already initialized, refer to that. @@ -104,8 +105,6 @@ define([ // Do not use parent's render function. It set's tabindex to -1 on // checkboxes. - - var col = this.column.get('name'); let id = `row-${_.uniqueId(col)}`; this.$el.empty().append(` @@ -429,6 +428,35 @@ define([ }); }, + hooks: { + onshow: function() { + commonUtils.findAndSetFocus($(this.elements.body)); + let self = this; + let containerFooter = $(this.elements.content).find('.wizard-buttons').find('.ml-auto'); + //To get last header button + let lastHeaderButton = $(this.elements.content).find('.wizard-header').find('.ml-auto').find('button:first'); + + $(containerFooter).on('keydown', 'button', function(event) { + if (!event.shiftKey && event.keyCode == 9 && $(this).nextAll('button:not([disabled])').length == 0) { + // set focus back to first editable input element of current active tab once we cycle through all enabled buttons. + let container = $(self.elements.content).find('.wizard-header'); + commonUtils.findAndSetFocus(container.find('button:not([disabled]):first')); + return false; + } + }); + + $(lastHeaderButton).on('keydown', function(event) { + if (event.shiftKey && event.keyCode == 9) { + // set focus back to first element of current active tab once we cycle through all enabled buttons. + let container = $(self.elements.content).find('.wizard-footer'); + commonUtils.findAndSetFocus(container.find('button:not([disabled]):last')); + return false; + } + }); + + }, + }, + prepare: function() { var that = this; $container.empty().append('
');