javascript - 过滤后 rowData 保留在第一条记录上

Question

使用数据表的过滤器框时，rowId第一条记录上仍然存在，我不知道为什么。

这是数据表（尽可能简化）：

$.ajax({
  url: 'process/getData.php',
    type: 'POST',
    data: data,
    dataType: 'html',
    success: function(data, textStatus, jqXHR){
      var jsonObject = JSON.parse(data); 
      var table = $('#example1').DataTable({
        "data": jsonObject,
        "columns": [  
          {
            "data": "MONDAY",
            "fnCreatedCell": function (nTd, sData, oData, iRow, iCol)
            {
              $(nTd).html("<span class='checkMon'>+oData.MONDAY+</span>");
            },
            // columns for each work day
          }
        ],
        "paging": false,
        "scrollY": 730,
        "scrollX": true,
        "bDestroy": true,
        "stateSave": true,
        "autoWidth": true
      });
    },
    error: function(jqHHR, textStatus, errorThrown) {
      console.log('fail: '+ errorThrown);
      return false;
    }
});

在数据表之外，我有onclick事件处理程序：

$('#example1').on('click', 'tr > td > .checkMon', function(e)
{
  e.preventDefault();
  var $dataTable = $('#example1').DataTable();
  var tr = $(this).closest('tr');
  var data = $dataTable.rows().data();
  var rowData = data[tr.index()];

  console.log(rowData.UID);
});

在过滤之前，当我单击任何单元格时，控制台会读取正确的rowData.UID.

问题是当我再次过滤并单击单元格时，控制台会读取第一行的rowData.UID.

有谁知道为什么会发生这种情况以及如何解决它？

标签： javascriptjquerydatatables

Answer 1

如果您想要实现的只是登录到获取包含您单击UID的行的对象的控制台属性，则以下方法应该有效：<span>

$('#example1').on('click', '.checkMon', function(e)
{
  e.preventDefault();
  const dataTable = $('#example1').DataTable();
  const rowData = dataTable.row($(this).closest('tr')).data();
  console.log(rowData.UID);
});

另外，考虑使用ajax选项。这样你就不需要浪费性能来破坏/重新创建你的表，这将使你的代码更干净、更安全。