如何获取数据表中的行数据

Question

我处于一种情况下，我正在尝试从数据表中获取特定行的数据。 我是dataTable的新手。

所以这是情况
下图是我的数据表内容显示。

下面是我的数据表的代码

 $(document).ready(function() { var table =$('#example').dataTable({ "processing": true, "ajax": { "url":'/myWeb/Controller/getUserList', "dataSrc":"" }, "columns": [ { "data": "userName"}, { "data": "roles" }, { data: "userName", render: function ( data, type, row ) { if ( type === 'display' ) { return '<button type="button" id='+data+' class="btn btn-default btn-sm" data-toggle="modal" data-target="#editUser" data-whatever="@getbootstrap()" onclick="getUserName(this.id)" > <span class="glyphicon glyphicon-pencil"></span> Edit </button>'; } //alert(data); return data; } }, { data : "userName", if ( type === 'display' ) { return '<button type="button" id='+data+' class="btn btn-default btn-sm" onclick="countUserRecord(this.id)"> <span class="glyphicon glyphicon-trash"></span> Delete </button>'; } //alert(data); return data; } } ], "paging": false, "info": false, "filter": false, "sort": false }); } ); 

我通过用户名时在删除按钮上，我也想通过角色，所以我尝试了这个

 role = row.roles; userName = row.userName; status = row.status; alert("username :"+userName+" role: "+role); 

但是当我这样做时，我为每个用户获得了不同的角色。 这给了我错误的用户角色。

下面是我从DB获得的Json结构。

 [ {"userName":"admin", "password":null, "roles":"Admin", "status":"Active", "email":"emailAdmin"}, {"userName":"varun", "password":null, "roles":"User", "status":"Active", "email":"emailVarun"}, {"userName":"bob", "password":null, "roles":"Admin", "status":"Active", "email":"undefined"} ] 

我想要做的是，当我单击“删除用户”按钮时，它也应该传递用户名和角色，我该怎么做，

Answer 1

这应该可以解决问题：

$('table').on('click','.addDeleteClassToDeleteBtns',function(){
     var containerRow = $(this).parents('tr');
     var userName    = containerRow.find('td:first-child').html();
     var role         = containerRow.find('td:nth-child(2)').html();
     alert(role+' '+userName);
});

要么

function countUserRecord(deleteId){
     var containerRow = $('#deleteId').parents('tr');
     var userName    = containerRow.find('td:first-child').html();
     var role         = containerRow.find('td:nth-child(2)').html();
     alert(role+' '+userName);
}

您可以编辑选择器以使其更适合您的代码。