CODEWITHSUNDEEP
jqueryjquery-ui
Cindrella
Cindrella

Reputation: 1721

Cancel option of Draggable preventing drag of children elements

I have element in html as:

<div class="abc"
<ul>
 <li class="noDrag">
    <div></div>
    <ul>
      <li>
        <div></div>
       </li>
      <li>
        <div></div>
      </li>
    </ul>
 </li>
</ul>
</div>

I have initialized drag and drop as:

 $('.abc li').draggable({
      cancel: ".noDrag",
      cursor: 'move',
    });

    $('.abc li').droppable({
      greedy: true
    });

How to fix below:

1) Since "noDrag" class is in parent li it is also preventing the drag for childern li. I want to prevent drag for only div of parent li "noDrag" class.

2) I dont' want to even show the drag movement for "cancel" option elements. I want to show the normal cursor for those.

Upvotes: 0

Views: 101

Answers (1)

SarathSprakash
SarathSprakash

Reputation: 4624

Working DEMO

 $('.abc>ul>li *').draggable({
    cancel:'.noDrag>div',
    cursor: 'move',
});

Hope this helps thank you

Upvotes: 1

Related Questions