Jquery datatable上父行上方的子行

我一直在研究datatable子行，我找到了datatable提供的示例

问题是他们提供了要在父行下方生成的子行，但我的要求是在父行上方生成子行

有没有办法做到这一点

我实现了父行下的子行，如下所示

function format ( d ) {
    return 'Full name: '+d.first_name+' '+d.last_name+'<br>'+
        'Salary: '+d.salary+'<br>'+
        'The child row can contain any data you wish, including links, images, inner tables etc.';
}

$(document).ready(function() {
    var dt = $('#example').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "scripts/ids-objects.php",
        "columns": [
            {
                "class":          "details-control",
                "orderable":      false,
                "data":           null,
                "defaultContent": ""
            },
            { "data": "first_name" },
            { "data": "last_name" },
            { "data": "position" },
            { "data": "office" }
        ],
        "order": [[1, 'asc']]
    } );

    // Array to track the ids of the details displayed rows
    var detailRows = [];

    $('#example tbody').on( 'click', 'tr td.details-control', function () {
        var tr = $(this).closest('tr');
        var row = dt.row( tr );
        var idx = $.inArray( tr.attr('id'), detailRows );

        if ( row.child.isShown() ) {
            tr.removeClass( 'details' );
            row.child.hide();

            // Remove from the 'open' array
            detailRows.splice( idx, 1 );
        }
        else {
            tr.addClass( 'details' );
            row.child( format( row.data() ) ).show();

            // Add to the 'open' array
            if ( idx === -1 ) {
                detailRows.push( tr.attr('id') );
            }
        }
    } );

    // On each draw, loop over the `detailRows` array and show any child rows
    dt.on( 'draw', function () {
        $.each( detailRows, function ( i, id ) {
            $('#'+id+' td.details-control').trigger( 'click' );
        } );
    } );
} );

函数格式（d）{
返回“全名：”+d.first\u name+“”+d.last\u name+”
'+
“工资：”+d.Salary+“
”+
'子行可以包含您想要的任何数据，包括链接、图像、内部表等。'；
}
$（文档）.ready（函数（）{
var dt=$（'示例'）。数据表（{
“处理”：对，
“服务器端”：正确，
“ajax”：“scripts/ids objects.php”，
“栏目”：[
{
“类”：“详细信息控制”，
“可订购”：错误，
“数据”：空，
“defaultContent”：”
},
{“数据”：“名字”}，
{“数据”：“姓氏”}，
{“数据”：“位置”}，
{“数据”：“办公室”}
],
“订单”：[[1，‘asc']]
} );
//数组以跟踪显示的详细信息行的ID
var-detailRows=[]；
$（#示例tbody'）。在（'click'，'tr td.details control'，函数（）{
var tr=$（this.nexist（'tr'）；
var行=dt行（tr）；
var idx=$.inArray（tr.attr（'id'），detailRows）；
if（row.child.isShown（））{
tr.removeClass（‘细节’）；
row.child.hide（）；
//从“打开”数组中删除
接头（idx，1）；
}
否则{
tr.addClass（‘细节’）；
row.child（格式（row.data（））.show（）；
//添加到“打开”数组
如果（idx==-1）{
detailRows.push（tr.attr（'id'））；
}
}
} );
//在每次绘制时，在“detailRows”数组上循环并显示所有子行
dt.on（'draw'，函数（）{
$.each（详细信息行、函数（i、id）{
$（“#”+id+“td.details控件”）.trigger（'click'）；
} );
} );
} );

---

希望有人能提供帮助。：-

尝试以下逻辑：使用class=“child”单击tr之前添加tr。检查单击的tr是否具有类

详细信息

，并相应地在tr之前添加或删除子项

var tableData={
“抽签”：1，
“recordsTotal”：57，
“记录过滤”：57，
“数据”：[
{
“DT_RowId”：“第5行”，
“名字”：“Airi”，
“姓氏”：“Satou”，
“职位”：“会计”，
“办公室”：“东京”，
“开始日期”：“2008年11月28日”，
“工资”：“$162700”
},
{
“DT_RowId”：“第25行”，
“名字”：“Angelica”，
“姓氏”：“拉莫斯”，
“职位”：“首席执行官（CEO）”，
“办公室”：“伦敦”，
“开始日期”：“2009年10月9日”，
“工资”：“$1200000”
},
{
“DT_RowId”：“第3行”，
“名字”：“阿什顿”，
“姓”：“考克斯”，
“职位”：“初级技术作者”，
“办公室”：“旧金山”，
“开始日期”：“2009年1月12日”，
“工资”：“$86000”
},
{
“DT_RowId”：“第19行”，
“名字”：“布拉德利”，
“姓”：“格里尔”，
“职位”：“软件工程师”，
“办公室”：“伦敦”，
“开始日期”：“10月13日12日”，
“工资”：“$132000”
},
{
“DT_RowId”：“第28行”，
“名字”：“布伦登”，
“姓”：“瓦格纳”，
“职位”：“软件工程师”，
“办公室”：“旧金山”，
“开始日期”：“2011年6月7日”，
“工资”：“$206850”
},
{
“DT_RowId”：“第6行”，
“名字”：“Brielle”，
“姓”：“威廉姆森”，
“职位”：“集成专家”，
“办公室”：“纽约”，
“开始日期”：“12月2日”，
“工资”：“$372000”
},
{
“DT_RowId”：“第43行”，
“名字”：“布鲁诺”，
“姓氏”：“纳什”，
“职位”：“软件工程师”，
“办公室”：“伦敦”，
“开始日期”：“5月3日11日”，
“工资”：“$163500”
},
{
“DT_RowId”：“第23行”，
“名字”：“凯撒”，
“姓”：“万斯”，
“职位”：“售前支持”，
“办公室”：“纽约”，
“开始日期”：“12月11日”，
“工资”：“$106450”
},
{
“DT_RowId”：“第51行”，
“名字”：“卡拉”，
“姓”：“史蒂文斯”，
“职位”：“销售助理”，
“办公室”：“纽约”，
“开始日期”：“11年12月6日”，
“工资”：“$145600”
},
{
“DT_RowId”：“第4行”，
“名字”：“塞德里克”，
“姓”：“凯利”，
“职位”：“高级Javascript开发人员”，
“办公室”：“爱丁堡”，
“开始日期”：“3月12日29日”，
“工资”：“$433060”
}
]
}
函数格式（d）{
返回“全名：”+d.first\u name+“”+d.last\u name+”
'+
“工资：”+d.Salary+“
”+
'子行可以包含您想要的任何数据，包括链接、图像、内部表等。'；
}
$（文档）.ready（函数（）{
var dt=$（'示例'）。数据表（{
“栏目”：[
{
“类”：“详细信息控制”，
“可订购”：错误，
“数据”：空，
“defaultContent”：”
},
{“数据”：“名字”}，
{“数据”：“姓氏”}，
{“数据”：“位置”}，
{“数据”：“办公室”}
],
“订单”：[[1，‘asc']]
} );
dt.clear（）；
dt.rows.add（tableData.data）；
dt.draw（）；
//数组以跟踪显示的详细信息行的ID
var-detailRows=[]；
$（#示例tbody'）。在（'click'，'tr td.details control'，函数（）{
var tr=$（this.nexist（'tr'）；
var行=dt行（tr）；
var idx=$.inArray（tr.attr（'id'），detailRows）；
if（tr.hasklass（'details'））{
tr.removeClass（‘细节’）；