I am facing an issue with jquery sortable and contenteditable. The problem arises when I try to use jquery sortable along with contenteditable, as the contenteditable feature stops working. After searching on Stack Overflow, I found a solution. However, upon implementing it, a new problem surfaced - the sortable functionality ceases to work on mousedown event.
What could I be doing incorrectly?
Check out the Stack Overflow link for more insights
<div class="sortable">
<div id="" style="background: #eee; width: 80%; margin: 10px auto; padding: 10px;">
<p contenteditable="true" style="padding: 5px;">Add your text here.</p> </div>
<div id="" style="background: #eee; width: 80%; margin: 10px auto; padding: 10px;">
<p contenteditable="true" style="padding: 5px;">Add your text here.</p> </div>
<div id="" style="background: #eee; width: 80%; margin: 10px auto; padding: 10px;">
<p contenteditable="true" style="padding: 5px;">Add your text here.</p> </div>
</div>
Initially, I used this snippet of code:
$('.sortable').sortable();
Then, I switched to the following code:
$('.sortable').on('onmousedown', function() {
$(".sortable").sortable({
cursor: 'move'
});
})