I have a list of element, I want to make it sortable and draggable using Jquery. But when we dragg the particular element, it should not overlap to other existing element.Please any one help me.
Asked
Active
Viewed 2,413 times
2 Answers
0
<script>
$(function() {
$( ".abc" ).draggable();
});
</script>
<ul>
<li class="abc"> 1 </li>
<li class="abc"> 2 </li>
<li class="abc"> 3 </li>
</ul>
user112233
- 41
- 5
-
Actually, we need both features(sortable & draggable) to the list of elements at a time. – shama Apr 10 '13 at 11:23
-
Try the another answer i posted – user112233 Apr 10 '13 at 12:14
0
<script>
$(function() {
$( ".abc" ).draggable({
connectToSortable: "#sortable",
revert: "invalid"
});
$( "#sortable" ).sortable({
revert: true
});
$( "#sortable" ).disableSelection();
});
</script>
<ul id="sortable">
<li class="abc"> 1 </li>
<li class="abc"> 2 </li>
<li class="abc"> 3 </li>
</ul>
user112233
- 41
- 5
-
-
http://jqueryui.com/draggable/#sortable : This example works fine with both draggable & sortable without overlapping. – user112233 Apr 10 '13 at 12:26