JQuery DataTables: как добавить идентификатор строки в каждую динамически добавленную строку?

Резюме

Я использую отличный плагин jQuery dataTables из http://www.datatables.net. В моем script я динамически добавляю строки, основанные на запуске события, используя fnAddData. Используя fnRowCallback, я добавляю уникальный идентификатор строки. Иногда это прерывается и не добавляет идентификатор строки. В тесте из 46 добавлений в строки обычно от 6 до 8 строк не получают идентификатор строки.

Добавить функцию строки

function ps_ins(row)
{
  var rowArray = row.split('|');
  row = rowArray;
  var alarmID = parseInt(row[1],10);

  $('#mimicTable').dataTable().fnAddData([
    alarmID, 'col2', 'col3', 'col4',
    'col5', 'col6', 'col7'
  ]);
}

Строки добавляются в таблицу правильно. Тест, который я запускаю, добавляет 46 строк, и все выглядит так, как ожидалось.

Добавить идентификатор строки

Я пытаюсь добавить уникальный идентификатор к каждой строке, чтобы впоследствии модифицировать определенную строку и ссылаться на нее в кеше dataTable с помощью комбинации fnGetRows и .filter.

Я делаю это, используя fnRowCallback на этапе инициализации. Я сохранил все остальные настройки, просто там что-то там, что может повлиять на проблему.

  $('#mimicTable').dataTable({
    "sDom": 'lip<"mimicSpacer">f<"numUnAck">rt',
    "sScrollY": "365px",
    "aaSorting": [[4,'desc'],[5,'desc']],
    "iDisplayLength": 15,
    "aLengthMenu": [[15, 50, 100, -1], [15, 50, 100, 'All']],
    "bAutoWidth": false,
    "aoColumns": [
      null,
      { "sWidth": "20%" },
      { "sWidth": "22%" },
      { "sWidth": "9%" },
      { "sWidth": "9%" },
      { "sWidth": "20%" },
      { "sWidth": "20%" }
    ],
    "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull) {
      $(nRow).attr("id",'alarmNum' + aData[0]);
      return nRow;
    }
  });

A console.log объекта dataTable показывает:

Как вы можете видеть, # 14 имеет идентификатор строки, а также правильный класс rowStripe. № 15 (и далее) нет.

Итак, почему fnRowCallback не запускается каждый раз, когда добавляется строка, только иногда? Может быть, есть лучший способ добавить идентификатор строки при добавлении строки?

Ответ 1

Найдено решение: http://www.datatables.net/forums/discussion/2119/adding-row-attributes-after-fnadddata/p1

Для всех, кто хочет быстрое решение, я сделал:

var addId = $('#mimicTable').dataTable().fnAddData([
  alarmID,
  'col2',
  'col3',
  'col4',
  'col5'
]);

var theNode = $('#mimicTable').dataTable().fnSettings().aoData[addId[0]].nTr;
theNode.setAttribute('id','alarmNum' + alarmID);

Ответ 2

Я знаю, что это довольно старый поток, но это может помочь другим. Самый простой способ сделать это, чтобы добавить атрибут id в последнюю добавленную строку, как только я назвал функцию таблицы данных fnAddData,:

$('#table').dataTable().fnAddData( ['col1','col2','col3'] );     

$('#table tr:last').attr('id','col'+row_id);

Ответ 3

Попробуй, это сработало для меня красиво:

var newRow = oTable.fnAddData( [ etc..]);
var oSettings = oTable.fnSettings(); 
var nTr = oSettings.aoData[ newRow[0] ].nTr;
nTr.id = 'new id';

Ответ 4

В jsbin есть что-то неожиданное, даже если оно работает. Он инициализируется набором данных "браузеры". Затем он очищается. Затем он создает новую таблицу с одной строкой. Затем он очищается. Затем он создает новую таблицу с двумя строками. Затем он очищается. Затем он создает новую таблицу с тремя строками.

Мне нужно будет лучше понять образец кода и его конечную цель (и, к сожалению, мое внимание теперь отвлекается в другом месте), но вы должны знать, что fnRowCallback ДОЛЖЕН быть способом сделать это, и что есть много избыточных конструкций таблиц и дополнений строк, которые будут влиять на производительность, а также гибкость с изменением рендеринга в будущем.

Ответ 5

Вы можете использовать DT_RowId при добавлении новой строки и использовать объект вместо массива, см. ниже:

 $('#mimicTable').dataTable().fnAddData({
            'DT_RowId': alarmID, 0:'col2', 1:'col3', 2:'col4',
            3:'col5', 4:'col6', 5:'col7'
        });

Ответ 6

Это сработало для меня

var MyUniqueID = "tr123"; // this is the uniqueId.
var rowIndex = $('#MyDataTable').dataTable().fnAddData([ "column1Data", "column2Data"]);
var row = $('#MyDataTable').dataTable().fnGetNodes(rowIndex);
$(row).attr('id', MyUniqueID);