Question

问题：

我正在使用JQuery DataTables v1.10进行与工作相关的项目。
该项目需要使用作为表的值传入的已解析JSON数据来定义和创建数据表
创建数据表后，每列中的每个单元格都应该有一个单击事件，可以打开弹出窗口并传入从端点接收的JSON中的名称列表。端点根据单击的表格单元格而变化。
我认为，在数据表实例化时，我需要在每个表格单元格元素上定义的HTML5数据属性中存储某种独特的信息。我希望声明一个自定义数据属性（例如：data-endpoint =＆＃34;端点ID＆＃34;）但是我不确定如果通过动态生成表行可以做到这一点数据表。

因为我不了解/了解我的选择，所以我想描述一下我理想的做法：

实例化数据表并将解析后的JSON数据传递给它。
在表实例化时，在每个表格单元格元素上设置自定义数据属性。
访问表格单元格点击事件，将存储在正确数据属性中的信息传递给它，以获得正确的端点。
创建一个popin，显示从端点收到的结果。

我不太了解的部分是如何在表格单元格元素上创建自定义数据属性。这是可能的还是我需要考虑另一种方法。非常感谢任何帮助！

Answer 1

您可以尝试在实例化时使用createdRow回调。例如：

$table.dataTable({

    "destroy": true, // To replace existing data
    "data": jsonData,
    "columns": columns,

    // Per-row function to iterate cells
    "createdRow": function (row, data, rowIndex) {
        // Per-cell function to do whatever needed with cells
        $.each($('td', row), function (colIndex) {
            // For example, adding data-* attributes to the cell
            $(this).attr('data-foo', "bar");
        });
    }
});

我认为这可以帮助你做你需要的事。

Answer 2

我必须做那样的事情。我不确定其余的，但我使用了columnDefs选项来设置属性。

....
"destroy": true, // To replace existing data
"data": jsonData,
"columns": columns,
// Sets the attribute
"columnDefs": [{
    "targets":'_all',
    "createdCell": function(td){
        td.setAttribute('foo','bar');
    }
}]
...

它仍然使用createdCell选项，但它模仿我在文档中找到的内容（https://datatables.net/reference/option/columns.createdCell）。

将自定义数据属性插入JQuery DataTables

2 个答案: