Demo of option as object to get values ( name / value pair ) for droppable

HTML

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

<div id=d1></div>

jquery

<script>
$(document).ready(function() {
///////////
$( function() {
    $( "#draggable" ).draggable({
});
});
///////////
$( "#droppable" ).droppable({
classes: {
    "ui-droppable": "highlight"
  },
hoverClass: "drop-hover",
scope: "my_scope",
  drop: function( event, ui ) {
        $( this )
        .find( "p" )
        .html( "Welcome Dropped!" );
    }
 });
///////////////

var  options = $( "#droppable" ).droppable( "option" );
$('#d1').html( " <b>disabled </b> " + options.disabled );
$('#d1').append( "<br> <b>accept </b> " + options.accept );
$('#d1').append( "<br> <b>activeClass </b> " + options.activeClass );
$('#d1').append( "<br> <b>addClasses </b> " + options.addClasses );
$('#d1').append( "<br> <b>greedy </b> " + options.greedy );
$('#d1').append( "<br> <b>hoverClass </b> " + options.hoverClass );
$('#d1').append( "<br> <b>scope </b> " + options.scope );
$('#d1').append( "<br> <b>tolerance </b> " + options.tolerance );
})
</script>