mirror of
https://github.com/pgadmin-org/pgadmin4.git
synced 2025-02-25 18:55:31 -06:00
Fixed tab key navigation for some dialogs. Fixes #5371
This commit is contained in:
parent
21cb1a0166
commit
a05acb4f99
@ -46,3 +46,4 @@ Bug fixes
|
||||
| `Issue #5351 <https://redmine.postgresql.org/issues/5351>`_ - Fixed compilation warnings while building pgAdmin.
|
||||
| `Issue #5361 <https://redmine.postgresql.org/issues/5361>`_ - Fixes an issue where pgAdmin4 GUI does not display properly in IE 11.
|
||||
| `Issue #5362 <https://redmine.postgresql.org/issues/5362>`_ - Fixed an issue where the identical packages and sequences visible as different in the schema diff tool.
|
||||
| `Issue #5371 <https://redmine.postgresql.org/issues/5371>`_ - Fixed tab key navigation for some dialogs.
|
@ -8,8 +8,8 @@
|
||||
//////////////////////////////////////////////////////////////
|
||||
|
||||
define(['sources/gettext', 'underscore', 'jquery', 'backbone', 'backform',
|
||||
'backgrid', 'alertify', 'pgadmin.browser.node', 'pgadmin.browser.node.ui',
|
||||
], function(gettext, _, $, Backbone, Backform, Backgrid, Alertify, pgNode) {
|
||||
'backgrid', 'alertify', 'pgadmin.browser.node', 'sources/utils', 'pgadmin.browser.node.ui',
|
||||
], function(gettext, _, $, Backbone, Backform, Backgrid, Alertify, pgNode, commonUtils) {
|
||||
/**
|
||||
* Each Privilege, supporeted by an database object, will be represented
|
||||
* using this Model.
|
||||
@ -622,11 +622,16 @@ define(['sources/gettext', 'underscore', 'jquery', 'backbone', 'backform',
|
||||
command = new Backgrid.Command(ev),
|
||||
coll = this.model.get(this.column.get('name'));
|
||||
|
||||
if (ev.key == 'Tab'){
|
||||
commonUtils.handleKeyNavigation(event);
|
||||
}
|
||||
|
||||
if (command.moveUp() || command.moveDown() || command.save()) {
|
||||
// backgrid vertical navigation (Up/Down arrow key)
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
model.trigger('backgrid:edited', model, column, command);
|
||||
this.model.trigger('backgrid:edited', this.model, this.column, command);
|
||||
// model.trigger('backgrid:edited', model, column, command);
|
||||
return;
|
||||
}
|
||||
// esc
|
||||
|
@ -1555,7 +1555,7 @@ define('pgadmin.browser.node', [
|
||||
}
|
||||
let btnGroup = $(panel.$container.find('.pg-prop-btn-group'));
|
||||
let el = $(btnGroup).find('button:first');
|
||||
if (panel.$container.find('td.editable:last').is(':visible')){
|
||||
if (panel.$container.find('.number-cell.editable:last').is(':visible')){
|
||||
if (event.keyCode === 9 && event.shiftKey) {
|
||||
if ($(el).is($(event.target))){
|
||||
$(panel.$container.find('td.editable:last').trigger('click'));
|
||||
|
@ -240,61 +240,7 @@ define([
|
||||
return true;
|
||||
},
|
||||
keydownHandler: function(event) {
|
||||
let wizardHeader = $(event.currentTarget).find('.wizard-header');
|
||||
let wizardFooter = $(event.currentTarget).find('.wizard-footer');
|
||||
let gridElement = $(event.currentTarget).find('.select-row-cell:first');
|
||||
let gridElementLast = $(event.currentTarget).find('.select-row-cell:last');
|
||||
|
||||
let firstWizardHeaderButton = $(wizardHeader).find('button:enabled:first');
|
||||
let lastWizardHeaderButton = $(wizardHeader).find('button:enabled:last');
|
||||
let lastWizardFooterBtn = $(wizardFooter).find('button:enabled:last');
|
||||
let firstWizardFooterBtn = $(wizardFooter).find('button:enabled:first');
|
||||
|
||||
|
||||
if (event.shiftKey && event.keyCode === 9) {
|
||||
// Move backwards
|
||||
if(firstWizardHeaderButton && $(firstWizardHeaderButton).is($(event.target))) {
|
||||
if (lastWizardFooterBtn) {
|
||||
$(lastWizardFooterBtn).focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
}
|
||||
else if ($(firstWizardFooterBtn).is($(event.target))){
|
||||
if ($(gridElement).find('.custom-control-input').is(':visible')){
|
||||
$(gridElementLast).find('.custom-control-input').focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}else if ($(event.currentTarget).find('.wizard-content').find('.CodeMirror-scroll').is(':visible')){
|
||||
$(lastWizardHeaderButton).focus();
|
||||
}
|
||||
}
|
||||
} else if (event.keyCode === 9) {
|
||||
// Move forwards
|
||||
// If taget is last button then goto first element
|
||||
if(lastWizardFooterBtn && $(lastWizardFooterBtn).is($(event.target))) {
|
||||
$(firstWizardHeaderButton).focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}else if (event.target.innerText == 'Name'){
|
||||
if ($(gridElement).find('.custom-control-input').is(':visible')){
|
||||
$(gridElement).find('.custom-control-input').focus();
|
||||
}else {
|
||||
$(firstWizardFooterBtn).focus();
|
||||
}
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
} else if(event.target.tagName == 'DIV') {
|
||||
$(event.currentTarget).find('.custom-control-input:first').trigger('focus');
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
} else if(event.target.tagName == 'TEXTAREA'){
|
||||
$(firstWizardFooterBtn).focus();
|
||||
}
|
||||
} else if (event.keyCode === 27){
|
||||
//close the wizard when esc key is pressed
|
||||
$(wizardHeader).find('button.ajs-close').click();
|
||||
}
|
||||
commonUtils.handleKeyNavigation(event);
|
||||
},
|
||||
enableDisableNext: function(disable) {
|
||||
if (typeof(disable) != 'undefined') {
|
||||
|
@ -123,7 +123,7 @@ window.onload = function(e){
|
||||
<li id="mnu_management" class="nav-item active dropdown d-none">
|
||||
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">{{
|
||||
_('Management') }} <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu"></ul>
|
||||
<ul class="dropdown-menu" aria-hidden="true"></ul>
|
||||
</li>
|
||||
<li id="mnu_tools" class="nav-item active dropdown d-none">
|
||||
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">{{
|
||||
|
@ -1822,6 +1822,7 @@ define([
|
||||
|
||||
/* Check for sql editor preference changes */
|
||||
let self = this;
|
||||
this.$el.find('textarea').attr('tabindex', -1);
|
||||
pgBrowser.onPreferencesChange('sqleditor', function() {
|
||||
self.reflectPreferences();
|
||||
});
|
||||
|
@ -833,6 +833,12 @@ define([
|
||||
// go to Next Cell & if Shift is also pressed go to Previous Cell
|
||||
if (e.keyCode == 9 || e.keyCode == 16) {
|
||||
gotoCell = e.shiftKey ? self.$el.prev() : self.$el.next();
|
||||
if (self.$el.next().length == 0){
|
||||
setTimeout(function() {
|
||||
self.$el.find('.select2-selection').blur();
|
||||
}, 100);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
if (gotoCell) {
|
||||
|
@ -9,6 +9,8 @@
|
||||
|
||||
import _ from 'underscore';
|
||||
import { getTreeNodeHierarchyFromIdentifier } from 'sources/tree/pgadmin_tree_node';
|
||||
import $ from 'jquery';
|
||||
|
||||
|
||||
export function parseShortcutValue(obj) {
|
||||
var shortcut = '';
|
||||
@ -19,6 +21,64 @@ export function parseShortcutValue(obj) {
|
||||
return shortcut;
|
||||
}
|
||||
|
||||
export function handleKeyNavigation(event) {
|
||||
let wizardHeader = $(event.currentTarget).find('.wizard-header');
|
||||
let wizardFooter = $(event.currentTarget).find('.wizard-footer');
|
||||
let gridElement = $(event.currentTarget).find('.select-row-cell:first');
|
||||
let gridElementLast = $(event.currentTarget).find('.select-row-cell:last');
|
||||
|
||||
let firstWizardHeaderButton = $(wizardHeader).find('button:enabled:first');
|
||||
let lastWizardHeaderButton = $(wizardHeader).find('button:enabled:last');
|
||||
let lastWizardFooterBtn = $(wizardFooter).find('button:enabled:last');
|
||||
let firstWizardFooterBtn = $(wizardFooter).find('button:enabled:first');
|
||||
|
||||
|
||||
if (event.shiftKey && event.keyCode === 9) {
|
||||
// Move backwards
|
||||
if(firstWizardHeaderButton && $(firstWizardHeaderButton).is($(event.target))) {
|
||||
if (lastWizardFooterBtn) {
|
||||
$(lastWizardFooterBtn).focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
}
|
||||
else if ($(firstWizardFooterBtn).is($(event.target))){
|
||||
if ($(gridElement).find('.custom-control-input').is(':visible')){
|
||||
$(gridElementLast).find('.custom-control-input').focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}else if ($(event.currentTarget).find('.wizard-content').find('.CodeMirror-scroll').is(':visible')){
|
||||
$(lastWizardHeaderButton).focus();
|
||||
}
|
||||
}
|
||||
} else if (event.keyCode === 9) {
|
||||
// Move forwards
|
||||
// If taget is last button then goto first element
|
||||
if(lastWizardFooterBtn && $(lastWizardFooterBtn).is($(event.target))) {
|
||||
$(firstWizardHeaderButton).focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}else if (event.target.innerText == 'Name'){
|
||||
if ($(gridElement).find('.custom-control-input').is(':visible')){
|
||||
$(gridElement).find('.custom-control-input').focus();
|
||||
}else {
|
||||
$(firstWizardFooterBtn).focus();
|
||||
}
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
} else if(event.target.tagName == 'DIV') {
|
||||
$(event.currentTarget).find('.custom-control-input:first').trigger('focus');
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
} else if(event.target.tagName == 'TEXTAREA'){
|
||||
$(firstWizardFooterBtn).focus();
|
||||
}
|
||||
} else if (event.keyCode === 27){
|
||||
//close the wizard when esc key is pressed
|
||||
$(wizardHeader).find('button.ajs-close').click();
|
||||
}
|
||||
}
|
||||
|
||||
export function findAndSetFocus(container) {
|
||||
if (container.length == 0) {
|
||||
return;
|
||||
|
@ -987,6 +987,9 @@ var StringCell = Backgrid.StringCell = Cell.extend({
|
||||
|
||||
/** @property */
|
||||
className: "string-cell",
|
||||
attributes: {
|
||||
tabIndex: "0"
|
||||
},
|
||||
|
||||
formatter: StringFormatter
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user