2012-11-02 33 views
0

后,引导程序下拉停止工作我正在为管理员审查提交的目标的应用程序的页面工作。每个目标是在3个不同表格中的1个内的<tr>。 “审查”,“完整”和“提交”是三个表格。在将<tr>添加到不同的<table>

每个<tr>上都有一个btn组,可以根据当前拥有的状态来批准,恢复或拒绝。当状态改变时,包含目标的内容被删除并附加到适当的表中。

当它移动btn-group下拉菜单然后停止工作。我认为它可能需要在添加后添加.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(); 


     }); 


    }, 

编辑以添加代码

+0

搭建的jsfiddle追加HTML元素未做Ajax调用的变化。即将它们追加到btn点击。 – flynfish

+0

我创建了一个没有服务器端代码的版本:http://jsfiddle.net/nmM6c/ –

+0

你有没有第二个看看我的JSfiddle。谢谢:) –

回答

1

下拉工作不因正由wrapInner('<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与我在“审批”功能

+0

非常感谢!要在我的网站上试试这个。 :) –