How to restrict div to drag which contain class="XYZ"

Question

Please help me i am new in j Query and angular I have 1 Div it is Container for another Div i want to restrict Drag the Div Which contain class XYZ

have you tried this http://stackoverflow.com/questions/704564/disable-drag-and-drop-on-html-elements? — TechnoCrat, Nov 28 '16 at 12:14
you can use `cancel` property of `draggable` function. [fiddle](https://jsfiddle.net/pandeyvishal1986/fe8y7xjq/#&togetherjs=51hA9rDIwE) May it help! — RonyLoud, Nov 28 '16 at 12:34

score 1 · Answer 1 · answered Nov 28 '16 at 13:03

Use the cancel attribute of draggable function fiddle:

JS:

$('.drag').draggable({
    cancel: ".xyz",
    helper: function(){
        return "<span>Dragging</span>";
    }
});
$('#drop').droppable({
    accept: 'div',
    drop: function(e,ui){
        ui.draggable.text('I am draggable')
    }
})

HTML:

<div class="drag">I can be dragged</div>
<div class="drag xyz">I cannot be dragged</div>
<br/>
<br/>
<div id="drop">Drop Here</div>

How to restrict div to drag which contain class="XYZ"

1 Answers1