Question

我已经使用Datatables已有2个月了，我喜欢它，我们可以使用这些功能完成所有任务。

现在当我同时使用过滤（通过ajax）和行详细信息这两个函数时，我遇到了一个问题。当我使用一个或另一个时，一切正常。

我添加了行详细信息以对相关行进行更改。实际上，输入位于行详细信息中。

所以，这是我第一次过滤表然后尝试打开行详细信息时遇到的错误：

gtm-js.js:318 Uncaught TypeError: Cannot read property 'id' of undefined
    at format (gtm-js.js:318)
    at HTMLTableCellElement.<anonymous> (gtm-js.js:183)
    at HTMLTableSectionElement.dispatch (jquery.min.js:3)
    at HTMLTableSectionElement.q.handle (jquery.min.js:3)

我从ajax获得了带有数据表数据的var ID：

$data[] = array(
  "lb_type" => getLinkTypeFromId($row['lb_type']),
  "lb_user" => getUserFromId($row['lb_userid']),
  "lb_url" => "<a href=".$row['lb_url']." target='_blank'>".$row['lb_url']."</a>",
  "lb_title" => $row['lb_title'],
  "lb_kw" => $row['lb_kw'],
  "lb_anchortype" => getAnchorTypeFromId($row['lb_anchortype']),
  "lb_orderdate" => date("Y-m-d",strtotime($row['lb_orderdate'])),
  "lb_provider" => $row['lb_provider'],
  "lb_words" => $row['lb_orderwords'],
  "lb_delivdate" => $row['lb_delivdate'],
  "lb_publisdate" => $row['lb_publishdate'],
  "lb_anchor" => $row['lb_anchor'],
  "lb_cpurl" => $row['lb_cpurl'],
  "lb_topicmatch" => $row['lb_topicmatch'],
  "lb_dr" => $row['lb_dr'],
  "lb_cost" => $row['lb_cost'],
  "id" => $id,
);

这是我的过滤功能，我会在页面的每个开头（不带值）调用该函数，并在设置过滤选项时使用这些值：

function LBuilderTableFiltering(user='',type='',provider='',asset='',cat='',subcat='',starttime='',endtime='',progress=''){
    var dttable = $('#ViewLBuilderTable').DataTable({
      "processing" : true,
      "serverSide" : true,
      "order": [[ 7, "desc" ]],
      lengthChange: false,
      dom: 'Bfrtip',
      buttons: [
        'copy',
        'excel',
        'csv',
        {
          extend: 'colvis',
          collectionLayout: 'fixed three-column'
        }
      ],
      "ajax" : {
        url:"ajax/fetchLBuilder.php",
        type:"POST",
        data:{
          user:user,type:type,provider:provider,asset:asset,cat:cat,subcat:subcat,starttime:starttime,endtime:endtime,progress:progress
        },
        // success:function(data){
        //   console.log(data);
        // }
      },
      'columns' : [
        {
                "className":      'details-control',
                "orderable":      false,
                "data":           null,
                "defaultContent": ''
        },
       { "data": 'lb_type' },
       { "data": 'lb_user' },
       { "data": 'lb_url' },
       { "data": 'lb_title' },
       { "data": 'lb_kw' },
       { "data": 'lb_anchortype' },
       { "data": 'lb_orderdate' },
       { "data": 'lb_provider'},
       { "data": 'lb_words'},
       { "data": 'lb_delivdate'},
       { "data": 'lb_publisdate'},
       { "data": 'lb_anchor'},
       { "data": 'lb_cpurl'},
       { "data": 'lb_topicmatch'},
       { "data": 'lb_dr'},
       { "data": 'lb_cost'},
      ],
      "columnDefs": [
        { "orderable": false, "targets": 1},
        { "visible": false, "targets": [9,14,15] }
      ]
    });
    // Add event listener for opening and closing details
    $('#ViewLBuilderTable tbody').on('click', 'td.details-control', function () {
        var tr = $(this).closest('tr');
        var row = dttable.row(tr);

        console.log(dttable.row(tr));

        if ( row.child.isShown() ) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        }
        else {
            // Open this row
            row.child(format(row.data())).show();
            tr.addClass('shown');
        }
    });
  }

这是我的格式化功能：

function format (d) {
  var itemTpl = $('script[data-template="toggletrtemplate"]').text();
  var id=d.id;
  itemTplmod = itemTpl;
  itemTplmod = itemTplmod.split('${id}').join(id);
  return itemTplmod;
}

（我有一个行详细信息模板，只需更改其所有输入的ID）

因此，总而言之：当我打开页面并打开行详细信息时，它可以工作，但是当我过滤并打开行详细信息时，它没有打开，并且我收到了未知ID的错误

如果您有什么想法可以解决这个问题，那就太好了！

如果您想了解更多信息，请告诉我，我会给您：）

非常感谢您：D

数据表问题：过滤+行详细信息

0 个答案: