引导下拉列表在附加到<tr>不同的<table>后停止工作

Question

我正在为管理员审查提交目标的应用程序的页面上工作。每个目标是3个不同表中的1个中的<tr>。"评论"，"完整"one_answers"提交"是三张表。

每个<tr>上都有一个BTN组，可以根据当前的状态批准，恢复或拒绝选项。当更改状态时，包含目标并将其附加到适当的表中。

当它移动BTN组下拉列表时，然后停止工作。我认为它可能需要在附加后添加.dropdown();，但我无法使其正常工作。

不确定如何使用使用服务器端数据的B/C设置JSFIDDLE。有人对我有建议吗？

这是我当前所有代码的JSFIDDLE：http://jsfiddle.net/xkln4/

    approve: function(clicked) {
        var id = clicked.attr('data-id');
        $.post('<?=URL::to('supervisor/approve_objective')?>',{
            'id' : id,
            'trainee_id' : '<?=$trainee->id?>',
            'status' : 'completed' //or whatever it should be, one of 'submitted'|'completed'|'review'
        },
        function(data, textStatus){
            console.log('Post return data:');
            console.log(data);
            var status = data.status_translated;
            var lbl = $('.label-'+data.object.objective_id);
                    lbl.fadeOut('fast');
                    lbl.attr('class','label label-'+data.object.status+' label-'+data.object.objective_id)
                       .text(data.object.status_translated)
                       .fadeIn('fast');
                       clicked.closest('tr').children('td, th')
                               .animate({ padding: 0 })
                               .wrapInner('<div />')
                               .children()
                               .slideUp(function() { $(this).closest('tr').remove(); });
                    var row = clicked.closest('tr').html();
                    $('#approve-objectives-completed > tbody:last').append('<tr>'+row+'</tr>')
                                                                   .children('.dropdown-toggle')
                                                                   .dropdown();

        });

    },

编辑以添加代码

Answer 1

由于 wrapInner('<div />')

添加的DIV，下拉列表无法正常工作。

一种解决方案是将所有内容复制到新行之后，在最后一个td中删除该div ...

approve: function(clicked) {
      clicked.closest('tr').children('td, th')
             .animate({ padding: 0 })
             .wrapInner('<div />')
             .children()
             .slideUp(function() { $(this).closest('tr').remove(); });
      var row = clicked.closest('tr').html();
      $('#approve-objectives-completed > tbody:last').append('<tr>'+row+'</tr>')
      //Remove div       
      var $lastTdDiv = $('#approve-objectives-completed > tbody > tr:last > td:last > div');  
      var contents = $lastTdDiv.contents();
      $lastTdDiv.replaceWith(contents);

这是我在"批准"函数中更改的JSFiddle