JavaScript library problem after deleting a server-side element

[shahryarjb]

This is an example of starting create a simple library instead of SortableJS

// Step 1: Set up the HTML structure
<div class="draggable">
  <div draggable="true">Item 1</div>
  <div draggable="true">Item 2</div>
  <div draggable="true">Item 3</div>
</div>

<div class="droppable"></div>

// Step 2: Define the draggable elements
const draggableItems = document.querySelectorAll('.draggable [draggable=true]');

draggableItems.forEach(item => {
  item.addEventListener('dragstart', event => {
    event.dataTransfer.setData('text/plain', item.textContent);
  });
});

// Step 3: Define the droppable elements
const droppable = document.querySelector('.droppable');

droppable.addEventListener('dragover', event => {
  event.preventDefault();
  event.dataTransfer.dropEffect = 'move';
});

droppable.addEventListener('drop', event => {
  event.preventDefault();
  const droppedItem = event.dataTransfer.getData('text/plain');
  console.log(`Dropped item: ${droppedItem}, from draggable element: ${event.target}`);
});

// Step 7: Change order of items in div
const item1 = document.querySelector('.draggable div:nth-child(1)');
const item3 = document.querySelector('.draggable div:nth-child(3)');

// Move item3 before item1
item1.parentNode.insertBefore(item3, item1);

[shahryarjb]

temporary fix bug, please if you see another problem open this issue