I have implemented the JQuery Drag and Drop plug in into my web site. It works great, however, I am trying to access a div that is being sorted but find great difficulty selecting it.
So, I am trying to select each "dragbox" inside each column. This is usually simple work but for some reason I can't access it and can't see it in FireBug.
Does anyone have any ideas how I can access the "dragbox" items inside the cols using a loop? Thanks all!
EDIT:
开发者_运维百科I have also used find() and it did not work
<div class="column" id="col1">
<div class="dragbox" id="item1" >
control goes here
</div>
<div class="dragbox" id="item1" >
<!-- control goes here -->
</div>
</div>
<div class="column" id="col2">
<div class="dragbox" id="item3" >
<!-- control goes here -->
</div>
</div>
I am using the following JQuery:
$('.column').sortable({
connectWith: '.column',
handle: '.widget-header-holder',
cursor: 'move',
placeholder: 'placeholder',
forcePlaceholderSize: true,
opacity: 0.4,
stop: function(event, ui) {
$(ui.item).find('.widget-header-holder').click();
var sortorder = '';
$('.column').each(function() {
var itemorder = $(this).sortable('toArray');
var columnId = $(this).attr('id');
sortorder += columnId + '=' + itemorder.toString() + '&';
});
/*alert('SortOrder: ' + sortorder);*/
console.log(sortorder);
}
});
I played around with the demo code some and it does seem to work ok for me.
http://jsfiddle.net/U24TS/1/
You can see toArray does work as well as long as you have ids.
精彩评论