开发者

jQuery UI how: Click a button and send the whole sortable list to another tab

开发者 https://www.devze.com 2023-02-10 00:31 出处:网络
I am using the jquery sortable lists with tabs shown here http://jqueryui.com/demos/sortable/#connect-lists-through-tabs

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);
  });
});
0

精彩评论

暂无评论...
验证码 换一张
取 消