I have a list something similar to this in React
<div id="list">
<Item data-id="1">
<Item data-id="2">
<Item data-id="3">
<Item data-id="4">
<Item data-id="5">
</div>
I am using sortablejs
npm library for sorting.
Now, I want to exclude the last 2 elements from sorting,
Below is the function I use for sorting
import Sortable from 'sortablejs';
let list = document.getElementById('list');
Sortable.create(list, {
ghostClass: 'ghost',
store : {
set: (sortable) => {
// logic to store new order in DB
sortable.destroy();
}
}
});
Expected Result: Last 2 items should become non-draggable
also, first 3 items should not be able to go below them
How can I achieve that?
Solution for a similar problem is at: How to exclude an element from being dragged in sortable list?
I want equivalent of below mentioned code in React:
$(function() {
$('.sortable').sortable();
$('.sortable').disableSelection();
$('.sortable').sortable({ cancel: '.note' });
});
$('.sortable').sortable({
items : ':not(.note)'
});
from React : SortableJS: Exclude some last elements from sorting
No comments:
Post a Comment