Hello
I have following markup and javascript to sort some items. Items can be sorted within a block or across other blocks. It works but I have a problem in retrieving correct block ID after an item is moved from one block to another.
For example, if I move item 1 within "Block 1", I get "I am in Block= block_1" but if I move Item 1 to Block 2 I still get I am in Block 1.
But I want to make the block 2 as its parent container. I need to retrieve this id so that I can do some ajax and update the db accordingly.
Can you please help me correct this??
<div id="blocks_sortable">
<div id="block_1">
<h2>Block 1</h2>
<div class="items_sortable connectedSortable">
<div id="item_1">
<span>Item 1</span></div>
<div id="item_2">
<span>Item 2</span></div>
<div id="item_3">
<span>Item 3</span></div>
</div>
</div>
<div id="block_2">
<h2>Block 2</h2>
<div class="items_sortable connectedSortable">
<div id="item_4">
<span>Item 4</span></div>
<div id="item_5">
<span>Item 5</span></div>
<div id="item_6">
<span>Item 6</span></div>
</div>
</div>
</div>
<script>
$("#blocks_sortable").sortable({ });
$(".items_sortable").sortable({
connectWith: '.connectedSortable'
, forcePlaceholderSize: true
, stop : function(event, ui){
alert("I am in block = "+$(this).parent().attr("id"));
}
}).disableSelection();
</script>
Thank you.