Запретить перемещение элементов jquery ui
Подскажите пожалуйста, как я могу запретить перемещать элемент .item в блок #block_1, но разрешить перемещение из блока #block_1 в блок #block_2?
$("#block_1, #block_2").sortable({
connectWith: ".block",
placeholder: "placeholder",
});
.block {
width: 49%;
border: 1px solid #000;
height: 300px;
display: inline-block;
}
.block .item {
width: 100%;
height: 100px;
background: blue;
}
.placeholder {
width: 100%;
height: 100px;
background: grey;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js" integrity="sha256-6XMVI0zB8cRzfZjqKcD01PBsAy3FlDASrlC8SxCpInY=" crossorigin="anonymous"></script>
<div class="block" id="block_1">
<div class="item"></div>
</div>
<div class="block" id="block_2">
<div class="item"></div>
</div>