Merge pull request #14484 from jdalsem/widgetlayoutids

fix(views): prevent duplicate ids on widget layouts
Elgg · Oct 11, 2023 · 3f2f34f · 3f2f34f
2 parents a800b2a + b178779
commit 3f2f34f
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 10 deletions.
diff --git a/mod/theme_sandbox/views/default/theme_sandbox/modules/widgets.php b/mod/theme_sandbox/views/default/theme_sandbox/modules/widgets.php
@@ -49,7 +49,7 @@ function css_permissions_override() {
 for ($column_index = 1; $column_index <= $num_columns; $column_index++) {
 	$column_widgets = $widgets[$column_index];
 
-	echo "<div class='{$widget_class} elgg-widgets' id='elgg-widget-col-{$column_index}'>";
+	echo "<div class='{$widget_class} elgg-widgets elgg-widget-col-{$column_index}' data-widget-column='{$column_index}'>";
 	if (is_array($column_widgets) && count($column_widgets) > 0) {
 		foreach ($column_widgets as $widget) {
 			echo elgg_view_entity($widget);

diff --git a/views/default/elgg/widgets.js b/views/default/elgg/widgets.js
@@ -13,15 +13,11 @@ define(['jquery', 'elgg/Ajax', 'elgg/lightbox', 'jquery-ui/widgets/sortable'], f
 		var guidString = ui.item.attr('id');
 		guidString = guidString.substring(guidString.indexOf('elgg-widget-') + "elgg-widget-".length);
 
-		// elgg-widget-col-<column>
-		var col = ui.item.parent().attr('id');
-		col = col.substring(col.indexOf('elgg-widget-col-') + "elgg-widget-col-".length);
-
 		var ajax = new Ajax(false);
 		ajax.action('widgets/move', {
 			data: {
 				widget_guid: guidString,
-				column: col,
+				column: ui.item.parent().data('widgetColumn'),
 				position: ui.item.index()
 			}
 		});

diff --git a/views/default/page/layouts/widgets.php b/views/default/page/layouts/widgets.php
@@ -98,11 +98,11 @@
 	}
 
 	$grid .= elgg_format_element('div', [
-		'id' => "elgg-widget-col-{$column_index}",
 		'class' => [
 			'elgg-widgets',
+			"elgg-widget-col-{$column_index}",
 		],
-
+		'data-widget-column' => $column_index,
 	], $widgets_content);
 }
 

diff --git a/views/default/resources/widgets/add_panel.js b/views/default/resources/widgets/add_panel.js
@@ -31,9 +31,9 @@ define(['jquery', 'elgg', 'elgg/Ajax'], function($, elgg, Ajax) {
 
 			if (context && page_owner_guid) {
 				// target the correct widget layout
-				selector = '.elgg-layout-widgets-' + context + '[data-page-owner-guid="' + page_owner_guid + '"] #elgg-widget-col-' + new_widget_column;
+				selector = '.elgg-layout-widgets-' + context + '[data-page-owner-guid="' + page_owner_guid + '"] .elgg-widget-col-' + new_widget_column;
 			} else {
-				selector = '#elgg-widget-col-' + new_widget_column;
+				selector = '.elgg-widget-col-' + new_widget_column;
 			}
 
 			if (new_widget_position === 'top') {