Demo of Dragging elements Disabled option in JQuery

Disabled : True Disabled : False



To enable dragging the disabled option to be set to false

HTML

<div id="draggable" class='drg_box'>
  <p>Drag me around</p>
</div>
<br><br>
<button  id=b1 class=my_button>Disabled : True</button> <button  id=b2 class=my_button>Disabled : False</button>
<br><br>
<div id=d1></div>

jquery

<script>
$(document).ready(function() {
////////////////
$( "#draggable" ).draggable({
disabled:true
});
//////
//////
$("#b1").click(function(){
$( ".drg_box" ).draggable( "option", "disabled", true );
var disabled = $( ".drg_box" ).draggable( "option", "disabled" );
$('#d1').html("disabled : " + disabled);
})
///////////
//////
$("#b2").click(function(){
$( ".drg_box" ).draggable( "option", "disabled", false );
var disabled = $( ".drg_box" ).draggable( "option", "disabled" );
$('#d1').html("disabled : " + disabled);
})
///////////
var disabled = $( ".drg_box" ).draggable( "option", "disabled" );
$('#d1').html("disabled : " + disabled);
///////////
})
</script>