Пользовательский рендеринг при использовании обработки на стороне сервера

Question

Мне было интересно, можно ли изменить рендеринг таблицы после получения ответа ajax. Это похоже на функцию render, описанную здесь: https://www.datatables.net/manual/orthogonal-data.

Моего сервер возвращает данные, как

{ 
    "name":  
         { 
         id: "123456", 
         value: "Tiger Nixon" 
         } 
} 

Я хочу добавить к каждому имени ячейке идентификатора имени, как data-attribute или идентификатор для td и хочу добавить .on("click", handler) для каждой ячейки.

Возможно ли это?

Заранее спасибо

Answer 1

Это возможно с помощью функции columns.createdCell.

Ответ Gyrocode верен для старой версии DataTables.

Answer 2

Вы можете использовать DT_RowData или DT_RowAttr (требуется DataTables 1.10.5 или выше) параметры в ваших возвращаемых данных для назначения атрибутов <tr> элемента, который впоследствии можно извлекать в обработчик щелчка, см Server-side processing главу руководство.

В качестве альтернативы вы можете использовать метод render, но это может быть не так эффективно. Я предположил ниже, что индекс вашего столбца name равен 0 и что вы хотите установить атрибут data-id.

var table = $('#example').DataTable({ 
    "columnDefs": [{ 
     "data": "name.value", 
     "targets": 0, 
     "render": function (data, type, full, meta) { 
     if(type === 'display'){ 
      $('#example').DataTable().cell(meta.row, meta.col).nodes().to$().attr('data-id', full['name']['id']); 
     } 

     return data; 
     } 
    }] 
}); 

Вы можете добавить обработчик события щелчка, используя код ниже:

$(document).ready(function(){ 
    var table = $('#example').DataTable({ 
     // Define DataTables initialization options here 
    }); 

    $('#example tbody').on('click', 'td', function(){ 

     // Use table to access various API function 
     // 
     // For example: 
     // var data_cell = table.cell(this).data(); 

    }); 
});