Jquery 突出显示datatable ajax源数据中的新行

我试图突出显示添加到datatable 1.10的新行，但未成功

以下是我的表初始化：

$('#userList').DataTable({            
        serverSide: true,
    serverMethod: "GET",
    ajaxSource: base + "admin/users/users_list/showusers",      
        order: [ 0, "desc" ],    
        aoColumns: [
            {bVisible:false},                                  
            {data: null,
            render: function (data, type, row){
            if(row[2] === '4'){
                return '<span class="text-lt">'+row[1]+'</span>';
            } else {
                return row[1];
            }   
            }
            },
            {data: null,
            render: function (data, type, row){
            if(row[2] === '1'){
                return '<span class="label label-black">'+selectUG1+'</span>';
            } 
            else if(row[2] === '2') {
                return '<span class="label label-primary">'+selectUG2+'</span>'
            }
            else if(row[2] === '3') {
                return '<span class="label label-success">'+selectUG3+'</span>'
            }
            else if(row[2] === '4') {
                return '<span class="label label-danger">'+selectUG4+'</span>'
            } 
            }
            },
            null,
            {data:4,
            render: function(data, type, row){
                return (moment(data).format("DD/MM/YYYY"));
             }
            },
            {data:5,
            render: function(data, type, row){
                return (moment(data).format(tableDateTimeFormat));
             }
            },
            {bSortable: false, className: 'all', 
            data: 6,
            render: function(data, type, full, meta){
                return '<a href="'+base+'admin/users/edit_user/userid/'+data+'" class="animsition-link table-icon" data-toggle="tooltip" data-original-title="'+tooltipEdit+'">\
                        <span class="fa-stack">\
                        <i class="fa fa-square fa-stack-2x"></i>\
                        <i class="fa fa-edit fa-stack-1x fa-inverse"></i>\
                        </span>\
                        </a>\
                        <a href="#" id="'+data+'" class="table-icon red-icon delete" data-toggle="tooltip" data-original-title="'+tooltipDelete+'">\
                        <span class="fa-stack">\
                        <i class="fa fa-square fa-stack-2x"></i>\
                        <i class="fa fa-trash fa-stack-1x fa-inverse"></i>\
                        </span>\
                        </a>';}
            }
        ]            
    });

我使用以下方法：

setTimeout(function(){
        $.ajax({
            url: $form.attr('action'),
            type: 'POST',
            data: $form.serialize(),
            success:function(response){
                if(response.success){                       
                    usertable.rows.add([                           
                    ]).draw().nodes().to$().addClass('animated fadeIn').effect('highlight',{},3000); 
                    toastr.success(userAddSuccess)
                }                    
                $form.parents('.bootbox').modal('hide');               
            }
        });
    }, 3000);        

---

添加行时没有预期效果，我哪里出错了

我相信新行不会突出显示，因为您使用

serverSide:true

启用了服务器端处理。在此模式下，调用

draw（）

API方法将触发对服务器的请求。由于插件不知道添加了哪些行，因此对

nodes（）

的调用将返回

0

元素。

该行是否获得了

动画fadeIn

类？不，没有，也没有突出显示效果。感谢您的回复。您认为如果我尝试使用DT_RowId属性为每一行添加一个id，我就能解决服务器端为true的问题吗？@blips，有两种方法可以解决它。不清楚

response

变量的值是什么，而且

行中没有数据。添加（[]）

调用，因此我无法提供更详细的答案。如果您知道新添加行的ID（在您的示例中，它是

240

），那么您可以在table page event with plug-in中找到它）并突出显示它。感谢您的建议，现在我知道该怎么做了。

setTimeout(function(){
        $.ajax({
            url: $form.attr('action'),
            type: 'POST',
            data: $form.serialize(),
            success:function(response){
                if(response.success){                       
                    usertable.rows.add([                           
                    ]).draw().nodes().to$().addClass('animated fadeIn').effect('highlight',{},3000); 
                    toastr.success(userAddSuccess)
                }                    
                $form.parents('.bootbox').modal('hide');               
            }
        });
    }, 3000);