Home › Forums › JavaScript › Sortable Div's UI Not Working Correct › Reply To: Sortable Div's UI Not Working Correct
July 5, 2015 at 11:12 am
#204600
Participant
You have to dynamically determine the layout. Here’s a quick example.
http://codepen.io/alenabdula/pen/PqRPgG
$rows = $('.row');
$rows.each(function(index, el) {
$itemClass = $(this).find('.col').attr('class');
$layout = $itemClass.slice(-1);
$self = $(this);
$self.sortable({
placeholder: 'col-md-' + $layout + ' placeholder',
helper: 'clone',
appendTo: document.body,
opacity: 0.7,
start: function(event, ui) {
var $definedStyles = {
height: ui.item.height() + 60 + 'px',
padding: '2rem',
border: '3px dotted #999',
backgroundColor: '#ccc',
};
ui.placeholder.css($definedStyles);
ui.item.addClass('item-dragging');
},
stop: function(event, ui) {
ui.item.removeClass('item-dragging');
},
});
});
Hope that helps get you in the right direction.
Best, Alen.