Add auto-detected fields with drag and drop handler

Closes #13082

sao/src/window.js

@@ -1452,18 +1452,21 @@
         },
         sig_sel_add: function(el_field) {
             el_field = jQuery(el_field);
-            var field = el_field.attr('field');
-            var node = jQuery('<li/>', {
+            this._add_node(el_field.attr('field'), el_field.attr('name'));
+        },
+        _add_node: function(field, name) {
+            jQuery('<li/>', {
                 'field': field,
                 'class': 'draggable-handle',
-            }).text(el_field.attr('name')).prepend(
+            }).text(name).prepend(
                 Sao.common.ICONFACTORY.get_icon_img('tryton-drag')
-            ).click(function(e) {
-                if (e.ctrlKey || e.metaKey) {
+            ).click(function(evt) {
+                const node = jQuery(evt.target);
+                if (evt.ctrlKey || evt.metaKey) {
                     node.toggleClass('bg-primary');
                 } else {
-                    jQuery(e.target).addClass('bg-primary')
-                        .siblings().removeClass('bg-primary');
+                    node.addClass('bg-primary');
+                    node.siblings().removeClass('bg-primary');
                 }
             }).appendTo(this.fields_selected);
         },
@@ -1603,12 +1606,7 @@
                     Sao.i18n.gettext('Error'));
                 return false;
             }
-            var node = jQuery('<li/>', {
-                'field': field
-            }).text(name).click(() => {
-                node.addClass('bg-primary')
-                    .siblings().removeClass('bg-primary');
-            }).appendTo(this.fields_selected);
+            this._add_node(field, name);
             return true;
         },
         _traverse: function(fields, prefix, parents, i) {