Estou desenvolvendo um accordion que cada item irá receber uma lista de accordion. Para ordenar dinamicamente os itens de cada accordion, estou utilizando jquery draggable. Para a primeira lista de accordion o jquery funciona perfeitamente. Porém, para a segunda lista o draggable do jquery não funciona.
1 Resposta
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(function () {
$(".sortable").sortable({
connectWith: ".sortable",
revert: true
}).disableSelection();
});
</script>
</head>
<style>
.ui-state-default{
width: 350px;
height: 90px;
}
</style>
<body style="display: flex; gap:20px">
<div class="sortable">
<div class="ui-state-default">Item 1</div>
<div class="ui-state-default">Item 2</div>
<div class="ui-state-default">Item 3</div>
<div class="ui-state-default">Item 4</div>
<div class="ui-state-default">Item 5</div>
</div>
<div class="sortable">
<div class="ui-state-default">Item 1</div>
<div class="ui-state-default">Item 2</div>
<div class="ui-state-default">Item 3</div>
<div class="ui-state-default">Item 4</div>
<div class="ui-state-default">Item 5</div>
</div>
<div class="sortable">
<div class="ui-state-default">Item 1</div>
<div class="ui-state-default">Item 2</div>
<div class="ui-state-default">Item 3</div>
<div class="ui-state-default">Item 4</div>
<div class="ui-state-default">Item 5</div>
</div>
</body>
</html>
accept
em seu Droppable ?