fix: Only setup sortable row wrapper and invisible row placeholders w…

…hen adding a row to the stage
kevinchappell · Nov 28, 2023 · 25a27e6 · 25a27e6
1 parent 28e1236
commit 25a27e6
Showing 1 changed file with 19 additions and 17 deletions.
diff --git a/src/js/form-builder.js b/src/js/form-builder.js
@@ -1133,6 +1133,7 @@ function FormBuilder(opts, element, $) {
     if (enhancedBootstrapEnabled()) {
       const targetRow = `div.row-${columnData.rowUniqueId}`
 
+      let newRowCreated = false
       //Check if an overall row already exists for the field, else create one
       if ($stage.children(targetRow).length) {
         rowWrapperNode = $stage.children(targetRow)
@@ -1141,6 +1142,7 @@ function FormBuilder(opts, element, $) {
           id: `${field.id}-row`,
           className: `row row-${columnData.rowUniqueId} ${rowWrapperClass}`,
         })
+        newRowCreated = true
       }
 
       //Turn the placeholder into the new row. Copy some attributes over
@@ -1159,7 +1161,7 @@ function FormBuilder(opts, element, $) {
       })
 
       if (insertingNewControl && insertTargetIsColumn) {
-        if ($targetInsertWrapper.attr('prepend') == 'true') {
+        if ($targetInsertWrapper.attr('prepend') === 'true') {
           $(colWrapperNode).prependTo(rowWrapperNode)
         } else {
           $(colWrapperNode).insertAfter(`#${$targetInsertWrapper.attr('appendAfter')}`)
@@ -1172,15 +1174,28 @@ function FormBuilder(opts, element, $) {
       }
 
       //If inserting, use the existing index, do not always append to end
-      if (!insertingNewControl) {
+      if (!insertingNewControl && newRowCreated) {
         $li.after(rowWrapperNode)
       }
 
       $li.appendTo(colWrapperNode)
 
-      setupSortableRowWrapper(rowWrapperNode)
+      if (newRowCreated) {
+        setupSortableRowWrapper(rowWrapperNode)
+        SetupInvisibleRowPlaceholders(rowWrapperNode)
+        if (opts.enableColumnInsertMenu) {
+          $(rowWrapperNode).off('mouseenter')
+          $(rowWrapperNode).on('mouseenter', function(e) {
+            setupColumnInserts($(e.currentTarget))
+          })
 
-      SetupInvisibleRowPlaceholders(rowWrapperNode)
+          $(rowWrapperNode).off('mouseleave')
+          $(rowWrapperNode).on('mouseleave', function(e) {
+            hideColumnInsertButtons($(e.currentTarget))
+          })
+        }
+      }
+      setupColumnInserts(rowWrapperNode, true)
 
       //Record the fact that this field did not originally have column information stored.
       //If no other fields were added to the same row and the user did not do anything with this information, then remove it when exporting the config
@@ -1397,19 +1412,6 @@ function FormBuilder(opts, element, $) {
     if (rowId !== '0') {
       $(rowWrapperNode).attr('data-row-id',rowId)
     }
-
-    setupColumnInserts(rowWrapperNode, true)
-    if (opts.enableColumnInsertMenu) {
-      $(rowWrapperNode).off('mouseenter')
-      $(rowWrapperNode).on('mouseenter', function(e) {
-        setupColumnInserts($(e.currentTarget))
-      })
-
-      $(rowWrapperNode).off('mouseleave')
-      $(rowWrapperNode).on('mouseleave', function(e) {
-        hideColumnInsertButtons($(e.currentTarget))
-      })
-    }
   }
 
   function CheckTinyMCETransition(fieldListItem) {