Всем доброго времени суток!
Нужно организовать такую штуку:
Что бы можно было товары сортировать по группам, как вы уже поняли при помощи drag and drop
Суть заключается в том, что бы пользователь мог перемещать элементы не только по группам(div'ам), но и сортировать эти элементы внутри них...
Вот код, но он не хочет работать, вернее он перемещает в дивы, но не позволяет сортировать их, в чем ошибка?
var groupPrice = {
0:'#block2',
1:'#block3'
}
$(function() {
$('.textBlock').draggable({
helper:'clone',
cursor: 'move',
stop: function(){
$(this).css("background-color", "red");
}
});
for (var key in groupPrice) {
$(groupPrice[key]).droppable({
hoverClass: 'dropHere'
,drop: function(event, ui) {
$(this).append($('<div class="textBlock">' + ui.draggable.html() + '</div>'));
$(this).sortable({ opacity: 0.8, cursor: 'move', update: function() {alert("Изменено");}});
}
});
}
});
HTML:
<div class="wrapper">
Перетащите
<div id="block1">
<div class="textBlock">Товар 1</div>
<div class="textBlock">Товар 2</div>
<div class="textBlock">Товар 3</div>
</div>
<div id="block2"></div>
<div id="block3"></div>
</div>
Видел тему:
draggable+droppable+sortable возможно ли? , так и не понял до конца, что у меня не правильно?
