How do I disable a jQuery draggable, e.g. during an UpdatePanel postback?
We can disable drag and drop on HTML elements by setting the draggable attribute to false . We set draggable to false so we can't drag it. We add event listeners for the dragstart and drop events with addEventListener .
Draggable() Method This method allows the elements to be dragged with the help of mouse. Using jQuery UI, we can make the DOM(Document Object Model) elements to drag anywhere within the view port. This can be done by clicking on the draggable object by mouse and dragging it anywhere within the view port.
jQuery UI draggable() method is used to make any DOM element draggable. Once the element is made draggable, you can move it by clicking on it with the mouse and drag it anywhere within the viewport.
Limit draggable area using 'containment' option It is simple. All you have to do is, add an option called containment to the draggable() method. The containment option has a value parent.
Could create a DisableDrag(myObject) and a EnableDrag(myObject) function
myObject.draggable( 'disable' )
Then
myObject.draggable( 'enable' )
To temporarily disable the draggable behavior use:
$('#item-id').draggable( "disable" )
To remove the draggable behavior permanently use:
$('#item-id').draggable( "destroy" )
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With