Javascript Datatables嵌套表基于父表获取子表的行

我已经设置了嵌套的数据表，其中包含父表

MAINtable

和子表

adjlinesTable

。除了我正在绘制从

adjlinesTable

到

main表中的每一行的所有线条外，几乎所有的东西都能正常工作。对于
MAINtable
中的每一行，我只希望
adjlinesTable
包含
MAINtable（id）=adjlinesTable（adjustmentid）
中的记录。我已经运行了3天的循环，尝试不同的方法，但就是不能打败这个！这是我的剧本：

$(document).ready(function(){
function createChild ( row ){
var table = $('<table class="display" width="100%"/>');
 
    row.child( table ).show();
 
    var adjlinesTable = table.DataTable( {
    ajax: "php_pages/fetch_adjlines.php",
    pageLength: 5,
    columns: [
      { data: "id" },
      { data: "adjustmentid" },
      { data: "product" },
      { data: "quantity" }
    ],
    order: [[1, 'asc']],
    } );
}
var table = $('#MAINtable').DataTable( {
    ajax: "php_pages/fetch_adjustments.php",
    pageLength: 5,
    columns: [
      {
         className: 'details-control',
         orderable: false,
         data: null,
         defaultContent: ''
      },
      { data: "id" },
      { data: "date" },
      { data: "reason" }
    ],
    order: [[1, 'asc']],
  } );
  $('#MAINtable tbody').on('click', 'td.details-control', function () {
     var tr = $(this).closest('tr');
     var row = table.row( tr );
     var rowData = row.data();
 
     if ( row.child.isShown() ) {

       row.child.hide();
       tr.removeClass('shown');

       $('#' + rowData.id.replace(' ', '-')).DataTable().destroy();
     }
     else {
        createChild(row);
       tr.addClass('shown');
      }
  } );
} );

$（文档）.ready（函数（）{
函数createChild（行）{
变量表=$（''）；
row.child（table.show（）；
var adjlinesTable=表.数据表（{
ajax：“php_pages/fetch_adjlines.php”，
页长：5，
栏目：[
{数据：“id”}，
{数据：“adjustmentid”}，
{数据：“产品”}，
{数据：“数量”}
],
订单：[[1，‘asc']]，
} );
}
变量表=$（'#MAINtable'）。数据表（{
ajax：“php\u pages/fetch\u adjustments.php”，
页长：5，
栏目：[
{
className:“详细信息控件”，
可订购：错误，
数据：空，
默认内容：“”
},
{数据：“id”}，
{数据：“日期”}，
{数据：“原因”}
],
订单：[[1，‘asc']]，
} );
$（#MAINtable tbody'）。在（'click'，'td.details control'，函数（）{
var tr=$（this.nexist（'tr'）；
var行=表.行（tr）；
var rowData=row.data（）；
if（row.child.isShown（））{
row.child.hide（）；
tr.removeClass（“显示”）；
$（“#”+rowData.id.replace（“，-”）.DataTable（）.destroy（）；
}
否则{
createChild（row）；
tr.addClass（“显示”）；
}
} );
} );
为了完整起见，我终于在DataTables论坛上通过一些指针和大量测试解决了这个问题。我知道我需要将id从
MAINtable
发送到
adjlinestable
，但我完全无法理解它。部分问题在于DataTables会自动为每一行生成一个id——行35;。因此，如果您将其发送到php进行绘制，它将完全无用。我必须重写我的php，以便将DT_RowId设置为我的id，而不是它们生成的行。有了它，下面的代码将id发送到我的php代码以生成子表

请注意-row.id。。。它不是表中的id，而是Datatable id，除非您更改它

$(document).ready(function() {
        function createChild ( row ) {
            // This is the table we'll convert into a DataTable
            var table = $('<table class="display" width="100%" style="border: 1px solid black;"/>');
            
            // Display it the child row
            row.child( table ).show();

            // Initialise as a DataTable
            var adjlinesTable = table.DataTable( {
            ajax: {
                url: 'php_pages/fetch_adjlines.php',
                type: 'post',
                data: function ( d ) {
                    d.adjustmentid = row.id;
                }
            },
            columns: [
              { title: "Product", data: "product" },
              { title: "Quantity", data: "quantity" }
            ],
            order: [[0, 'asc']],
            dom: 
                "tr<'bottom'<'row'<'col-sm-12 col-md-6 col-lg-3'i><'col-sm-12 col-md-6 col-lg-3'l><'col-sm-12 col-md-12 col-lg-6'p>>>",         
            } );
        } 

  
  // Main table
  var table = $('#MAINtable').DataTable( {
    ajax: "php_pages/fetch_adjustments.php",
    columns: [
      {
         className: 'details-control',
         orderable: false,
         data: null,
         defaultContent: ''
      },
      { data: "date" },
      { data: "reason" }
    ],
    order: [[1, 'asc']],
    dom: 
        "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'p>>" +
        "<'row'<'col-sm-12'i>>",
    

    
    initComplete: function () {
        
        //Apply text search
        this.api().columns('.dt-filter-text').every(function () {
            var title = $(this.footer()).text();
            $(this.footer()).html('<input type="text" placeholder="Search '+title+'" />');
            var that = this;
            $('input',this.footer()).on('keyup change', function () {
                if (that.search() !== this.value) {
                    that
                        .search(this.value)
                        .draw();
                }
            });
        });
    }   
    
  } );
  
  
  // Add event listener for opening and closing first level childdetails
  $('#MAINtable tbody').on('click', 'td.details-control', function () {
     var tr = $(this).closest('tr');
     var row = table.row( tr );
 
     if ( row.child.isShown() ) {
       // This row is already open - close it
       destroyChild(row);
        tr.removeClass('shown');
        
        function destroyChild(row) {
            var table = $("table", row.child());
            table.detach();
            table.DataTable().destroy();
         
            // And then hide the row
            row.child.hide();
        }
     }
     else {
       // Open this row
        createChild(row);
       tr.addClass('shown');
       
      }
      
  } );
             

          
} );

$（文档）.ready（函数（）{
函数createChild（行）{
//这是我们将转换为DataTable的表
变量表=$（''）；
//将其显示在子行中
row.child（table.show（）；
//初始化为数据表
var adjlinesTable=表.数据表（{
阿贾克斯：{
url:'php_pages/fetch_adjlines.php'，
键入：“post”，
数据：功能（d）{
d、 adjustmentid=row.id；
}
},
栏目：[
{标题：“产品”，数据：“产品”}，
{标题：“数量”，数据：“数量”}
],
订单：[[0，'asc']]，
dom:
“tr”，
} );
} 
//主表
变量表=$（'#MAINtable'）。数据表（{
ajax：“php\u pages/fetch\u adjustments.php”，
栏目：[
{
className:“详细信息控件”，
可订购：错误，
数据：空，
默认内容：“”
},
{数据：“日期”}，
{数据：“原因”}
],
订单：[[1，‘asc']]，
dom:
"" +
"",
initComplete:函数（）{
//应用文本搜索
this.api（）.columns（'.dt filter text'）.every（函数（）{
var title=$（this.footer（））.text（）；
$（this.footer（））.html（“”）；
var=这个；
$（'input'，this.footer（））.on（'keyup change'，function（）{
if（that.search（）！==此.value）{
那个
.search（此.value）
.draw（）；
}
});
});
}   
} );
//添加用于打开和关闭第一级子详细信息的事件侦听器
$（#MAINtable tbody'）。在（'click'，'td.details control'，函数（）{
var tr=$（this.nexist（'tr'）；
var行=表.行（tr）；
if（row.child.isShown（））{
//此行已打开-关闭它
儿童（世界其他地区）；
tr.removeClass（“显示”）；
函数子对象（行）{
var table=$（“table”，row.child（））；
table.detach（）；
table.DataTable（）.destroy（）；
//然后隐藏行
row.child.hide（）；
}
}
否则{
//打开这一排
createChild（row）；
tr.addClass（“显示”）；
}
} );
} );