jQuery UI how: Click a button and send the whole sortable list to another tab
I am using the jquery sortable lists with tabs shown here http://jqueryui.com/demos/sortable/#connect-lists-through-tabs
What i need it to do is press a button, say "SEND ALL TO TAB 2", and all items of tab 1 are sent to tab 2. P开发者_运维百科lease, i really need this. Thanks.
The idea is to find all list items at tab 1, and append them to tab 2 list.
The following code is triggered when a button with id 'send_all' (consider placing it at the first tab) is pushed. It finds and moves all li items from 'sortable1' to 'sortable2', and then switches to the second tab.
$('#send_all').bind({
'click': function(){
$('#sortable1 li').each(function(){
$(this).appendTo('#sortable2');
});
$tabs.tabs('select', 1 );
}
});
Considering the button is a link with class transfer-items whose href points to the items container of the tab the items will be transfer to (in the ui example #tabs-1 #tabs-2):
$('a.transfer-items').click(function() {
var itemsContainer = $('#tabs .ui-state-selected a').attr('href');
var newList = $($(this).attr.href() + '.connectedSortable');
$(itemsContainer + ' .connectedSortable li').each(function(index, element) {
$(element).appendTo(newList);
});
});
精彩评论