xxxxxxxxxx
1
<!-- Sortable -->
2
<div data-mdb-sortable="sortable">
3
<div class="sortable-item">Item 1</div>
4
<div class="sortable-item">Item 2</div>
5
<div class="sortable-item">Item 3</div>
6
<div class="sortable-item">Item 4</div>
7
<div class="sortable-item">Item 5</div>
8
</div>
9
<button id="addElement" class="btn btn-primary mt-3">
10
Add element
11
</button>
1
1
xxxxxxxxxx
1
const addElementBtn = document.querySelector('#addElement');
2
3
addElementBtn.addEventListener('click', () => {
4
const newElement = document.createElement('div');
5
newElement.classList.add('sortable-item');
6
newElement.textContent = 'New Element';
7
8
const sortableElement = document.getElementById('sortable');
9
const instanceSortable = Sortable.getInstance(sortableElement);
10
instanceSortable.addIem(newElement);
11
alert('Element added');
12
});
13
14
Console errors: 0