I'm using: bootstrap.min, jquery-1.10.2, jquery-ui-1.10.4.min. Using these libs I want to provide drag'n'drop feature. Bootstrap buttons should be draggable, but they aren't. Console log is clear. jQuery & jQuery UI are loaded & works.
Script:
<script type="text/javascript">
$(document).ready(function() {
$('.btn.verticalButton').draggable({
connectToSortable: '.container',
containment: 'document',
helper: function(){ return $(html); }
});
$("#droppable").droppable({
drop: function (event, ui) {
$(ui.draggable).clone().appendTo(this);
$(ui.draggable).remove();
}
});
});
</script>
Html:
<div class="container">
<div class="row">
<div class="col-sm-6 col-md-6">
<div class="panel panel-info text-center">
<div class="panel-heading text-center">Buttons</div>
<div class="btn-group-vertical">
<button class="btn verticalButton">B1</button>
<button class="btn verticalButton">B2</button>
<button class="btn verticalButton">B3</button>
</div>
</div>
</div>
</div>
</div>