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

Question

Сводка

Я использую отличный плагин dataTables jQuery из http://www.datatables.net. В моем скрипте я динамически добавляю строки на основе запуска события, используя 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 строк, и все они отображаются, как и ожидалось.

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

Я пытаюсь добавить уникальный идентификатор для каждогоrow, чтобы впоследствии я мог изменить определенную строку и ссылаться на нее в кеше 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 не запускается при каждом добавлении строки, только иногда?Может быть, есть лучший способ добавить идентификатор строки при добавлении строки?

Answer 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);

Answer 2

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

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

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

Answer 3

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

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

Answer 4

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

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

Answer 5

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

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

Answer 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);