Improve display of columns of exclusion contraints and foreign keys in the properties lists. Fixes #2065

web/pgadmin/browser/server_groups/servers/databases/schemas/tables/constraints/exclusion_constraint/templates/exclusion_constraint/js/exclusion_constraint.js

@@ -427,9 +427,9 @@ function($, _, S, pgAdmin, pgBrowser, Alertify) {
         controls.push(control);
       });
 
-      // We should not show add but in properties mode
+      // We should not show in properties mode
       if (data.mode == 'properties') {
-        $header.find("button.add").remove();
+        $header.html('');
       }
 
       self.$header = $header;
@@ -443,12 +443,12 @@ function($, _, S, pgAdmin, pgBrowser, Alertify) {
                 ),
 
     showGridControl: function(data) {
-
       var self = this,
           titleTmpl = _.template("<div class='subnode-header'></div>"),
           $gridBody =
             $("<div class='pgadmin-control-group backgrid form-group col-xs-12 object subnode'></div>").append(
-              titleTmpl({label: data.label})
+              // Append titleTmpl only if create/edit mode
+              data.mode !== 'properties' ? titleTmpl({label: data.label}) : ''
             );
 
       $gridBody.append(self.generateHeader(data));
@@ -487,6 +487,10 @@ function($, _, S, pgAdmin, pgBrowser, Alertify) {
           );
       }, 10);
 
+      // Remove unwanted class from grid to display it properly
+      if(data.mode === 'properties')
+        $gridBody.find('.subnode-header-form').removeClass('subnode-header-form');
+
       // Render node grid
       return $gridBody;
     },

web/pgadmin/browser/server_groups/servers/databases/schemas/tables/constraints/foreign_key/templates/foreign_key/js/foreign_key.js

@@ -348,7 +348,7 @@ function($, _, S, pgAdmin, pgBrowser, Alertify) {
 
       // We should not show add but in properties mode
       if (data.mode == 'properties') {
-        $header.find("button.add").remove();
+        $header.html('');
       }
 
       self.$header = $header;
@@ -370,7 +370,8 @@ function($, _, S, pgAdmin, pgBrowser, Alertify) {
             "</div>"].join("\n")),
           $gridBody =
             $("<div class='pgadmin-control-group backgrid form-group col-xs-12 object subnode'></div>").append(
-              titleTmpl({label: data.label})
+              // Append titleTmpl only if create/edit mode
+              data.mode !== 'properties' ? titleTmpl({label: data.label}) : ''
             );
 
       // Clean up existing grid if any (in case of re-render)
@@ -419,6 +420,10 @@ function($, _, S, pgAdmin, pgBrowser, Alertify) {
           );
       }, 10);
 
+      // Remove unwanted class from grid to display it properly
+      if(data.mode === 'properties')
+        $gridBody.find('.subnode-header-form').removeClass('subnode-header-form');
+
       // Render node grid
       return $gridBody;
     },

web/pgadmin/static/js/backform.pgadmin.js

@@ -1949,6 +1949,11 @@
                 options: (this.field.get('options') || this.defaults.options)
             });
 
+      // If disabled then no need to show placeholder
+      if(data.disabled || data.mode === 'properties') {
+        select2Opts['placeholder'] = '';
+      }
+
       /*
        * Add empty option as Select2 requires any empty '<option><option>' for
        * some of its functionality to work and initialize select2 control.

web/pgadmin/static/js/backgrid/backgrid.pgadmin.js

@@ -669,6 +669,11 @@
 
       this.delegateEvents();
 
+      // If disabled then no need to show placeholder
+      if(!editable || col.mode === 'properties') {
+        select2_opts['placeholder'] = '';
+      }
+
       // Initialize select2 control.
       this.$sel = this.$select.select2(select2_opts);