Demo of setting and getting greedy option for droppable

If greedy option is set to true then parents can't receive draggable element.
Set the option for greedy.

HTML

<div class='row'> <div class='col-md-6'> 
<div id="draggable" class="ui-widget-content">
  <p>Drag me</p>
</div>
</div>
<div class='col-md-4'>  
<div id="droppable1" class="droppable ui-widget-header" >
  <p>Dropp here</p>

<div id="droppable2" class="droppable ui-widget-header" >
  <p>Dropp here</p>
<div id="droppable3" class="droppable ui-widget-header" >
  <p>Dropp here</p>
</div>
</div>

</div></div>

</div>
If greedy option is set to true then parents can't receive draggable element. 
<div id=d1></div><br>
Set the option  for greedy.

<br>
<div class='radio-inline'>
  <label><input type='radio' name='r1' id='r1' value='true' checked> True</label>
</div>

<div class='radio-inline'>
  <label><input type='radio' name='r1' id='r2' value='false' >False</label>
</div>
<div class=text-center><a href=''><button type='button' class='btn btn-info'>Try again : Refresh</button></a></div>

jquery

<script>
$(document).ready(function() {
///////////
$( function() {
    $( "#draggable" ).draggable({
});
});
///////////
$( ".droppable" ).droppable({
greedy: true,
  drop: function( event, ui ) {
        $( this )
        .find( "p" )
        .html( " Dropped! "+event.target.id );
    }
 });
///////////////
var status = $( ".droppable" ).droppable( "option", "greedy" );
$('#d1').html( " <b>Status of greedy </b>: " + status );
////////////
$("input:radio[name=r1]").click(function() {
var sel = ($(this).val() == 'true');
$( ".droppable" ).droppable( "option", "greedy", sel );
var status = $( ".droppable" ).droppable( "option", "greedy" );
$('#d1').html( " <b>Status of greedy </b>: " + status );
})
///////////////////////
})
</script>