Javascript 如何为DataTables中的按钮分配ID？

我有一个带有一些内容和编辑按钮的表格。这是生成数据表的代码：

$(document).ready(function() {
    var params = {};
    callFunction("getAgentList", params,
        function(bSuccess, res) {
            var table = $('#example').DataTable({
                data: res,
                "columns": [
                    { "data": "ID" },
                    { "data": "Name" },
                    { "data": "AltName1" },
                    { "data": "AltName2" },
                    { "data": "AltName3" },
                    { "data": "AltName4" },
                    { "data": "AltName5" },
                    { "data": "AltName6" },
                    { "data": "AltName7" },
                    { "data": "AltName8" },
                    { "data": "AltName9" },
                    { "data": "AltName10" },
                    {
                        "orderable": false,
                        "data": null,
                        "defaultContent": '<button class="btn btn-warning" id='+res+' onclick="edit(this)">Edit</button>'
                    },
                ],
                "order": [
                    [1, 'asc']
                ]
            });
        }
    );
});

 { "targets": 0, "data": 'iD' },
{ "targets": 1, "data": 'name' },
{ "targets": 2, "data": 'altName1' },
{ "targets": 3, "data": 'altName2' },
{ "targets": 4, "data": 'altName3' },
{ "targets": 5, "data": 'altName4' },
{ .... },
{
    "targets": 6,
    "data": 'iD',
    "render": function (data, type, row, meta) {
        return '<button class="btn btn-warning" id='+data+' onclick="edit(this)">Edit</button>'
    }
}

如果我将id设置为

Edit

---

然后所有按钮都具有相同的ID。

将JavaScript中的所有首字母更改为小写，然后使用datatable的呈现功能：

$(document).ready(function() {
    var params = {};
    callFunction("getAgentList", params,
        function(bSuccess, res) {
            var table = $('#example').DataTable({
                data: res,
                "columns": [
                    { "data": "ID" },
                    { "data": "Name" },
                    { "data": "AltName1" },
                    { "data": "AltName2" },
                    { "data": "AltName3" },
                    { "data": "AltName4" },
                    { "data": "AltName5" },
                    { "data": "AltName6" },
                    { "data": "AltName7" },
                    { "data": "AltName8" },
                    { "data": "AltName9" },
                    { "data": "AltName10" },
                    {
                        "orderable": false,
                        "data": null,
                        "defaultContent": '<button class="btn btn-warning" id='+res+' onclick="edit(this)">Edit</button>'
                    },
                ],
                "order": [
                    [1, 'asc']
                ]
            });
        }
    );
});

 { "targets": 0, "data": 'iD' },
{ "targets": 1, "data": 'name' },
{ "targets": 2, "data": 'altName1' },
{ "targets": 3, "data": 'altName2' },
{ "targets": 4, "data": 'altName3' },
{ "targets": 5, "data": 'altName4' },
{ .... },
{
    "targets": 6,
    "data": 'iD',
    "render": function (data, type, row, meta) {
        return '<button class="btn btn-warning" id='+data+' onclick="edit(this)">Edit</button>'
    }
}

{“目标”：0，“数据”：“iD”}，
{“目标”：1，“数据”：“名称”}，
{“目标”：2，“数据”：“altName1”}，
{“目标”：3，“数据”：“altName2”}，
{“目标”：4，“数据”：“altName3”}，
{“目标”：5，“数据”：“altName4”}，
{ .... },
{
“目标”：6，
“数据”：“iD”，
“呈现”：函数（数据、类型、行、元）{
返回“编辑”
}
}

在渲染函数中，可以通过不同的方式访问ID： 1：“数据”：“iD”然后您使用数据（就像我一样） 2：“数据”：“任何您想要的”，然后使用：row.iD

还请注意，您需要在ID之前添加前缀，以避免重复ID（我总是这样做）

试试这个

"defaultContent": '<button class="btn btn-warning" id='+ID+' onclick="edit('+ID+')">Edit</button>'

“defaultContent”：“编辑”

您是否尝试使用

console.log

转储

res

的结果？是。JSON不是问题所在。问题是如何将ID分配给它们各自的编辑按钮。我只想知道结果。也许在

res

中有一个ID，我更新了这个问题。是的，这是正确的方法。您应该链接到docs->，但要注意，

id

不应该以数字开头，

id=“3”

不是有效的HTML。因此，请使用类似于

data ID=“+data+””

的属性来引用ID……太棒了！不过，它也适用于大写字母：/未捕获引用错误：ID未定义，但

ID

从何而来。。。？问题是，您无法访问

defaultContent

中的行内容。它来自我调用

getAgentList

URL时得到的JSON。