public inbox for [email protected]  

help / color / mirror / Atom feed

From: Murtuza Zabuawala <[email protected]>
To: pgadmin-hackers <[email protected]>
Subject: [RM#4508] Fix tab navigation issue with Backgrid Datetime cell
Date: Wed, 24 Jul 2019 16:59:39 +0530
Message-ID: <CAKKotZSBTMiKBS=5vVTDnV5oGq-afcxOA5n68hv2Vg015_PfsA@mail.gmail.com> (raw)

Hi,

PFA minor patch to fix the tab navigation issue with Backgrid datetime cell.

--
Regards,
Murtuza Zabuawala
EnterpriseDB: http://www.enterprisedb.com
The Enterprise PostgreSQL Company


Attachments:

  [application/octet-stream] fix_datetime_backgrid.diff (2.0K, 3-fix_datetime_backgrid.diff)
  download | inline diff:
diff --git a/web/pgadmin/static/js/backgrid.pgadmin.js b/web/pgadmin/static/js/backgrid.pgadmin.js
index 1c4f6f1e99..f90ed380a6 100644
--- a/web/pgadmin/static/js/backgrid.pgadmin.js
+++ b/web/pgadmin/static/js/backgrid.pgadmin.js
@@ -1753,6 +1753,7 @@ define([
             },
           },
         });
+      this.tabKeyPress = false;
       this.$el.datetimepicker(options);
       this.$el.datetimepicker('show');
       this.picker = this.$el.data('DateTimePicker');
@@ -1760,27 +1761,41 @@ define([
     events: {
       'hide.datetimepicker': 'closeIt',
       'focusout':'closeIt',
+      'keydown': 'keydownHandler',
+    },
+    keydownHandler: function(event) {
+      // If Tab key pressed from Cell and not from Datetime picker element
+      // then we should trigger edited event so that we can goto next cell
+      let self = this;
+      let tabKeyPressed = true;
+      if (event.keyCode === 9 && self.el === event.target) {
+        self.closeIt(event, tabKeyPressed);
+      }
     },
-    closeIt: function(ev) {
+    closeIt: function(ev, isTabKeyPressed) {
+      if (this.is_closing || this.tabKeyPress)
+        return;
+
+      this.is_closing = true;
+      this.tabKeyPress = isTabKeyPressed;
+
       var formatter = this.formatter,
         model = this.model,
         column = this.column,
         val = this.$el.val(),
         newValue = formatter.toRaw(val, model);
 
-      if (this.is_closing)
-        return;
-      this.is_closing = true;
       this.$el.datetimepicker('destroy');
       this.is_closing = false;
 
-      var command = new Backgrid.Command(ev);
-
       if (_.isUndefined(newValue)) {
         model.trigger('backgrid:error', model, column, val);
       } else {
         model.set(column.get('name'), newValue);
-        model.trigger('backgrid:edited', model, column, command);
+        let command = new Backgrid.Command(ev);
+        setTimeout(() => {
+          model.trigger('backgrid:edited', model, column, command);
+        }, 20);
       }
     },
   });

view thread (2+ messages)  latest in thread

reply

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Reply to all the recipients using the --to and --cc options:
  reply via email

  To: [email protected]
  Cc: [email protected]
  Subject: Re: [RM#4508] Fix tab navigation issue with Backgrid Datetime cell
  In-Reply-To: <CAKKotZSBTMiKBS=5vVTDnV5oGq-afcxOA5n68hv2Vg015_PfsA@mail.gmail.com>

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox