如何通过单击DataTable的同一行上的“编辑”按钮获取Id值

时间:2016-09-08 17:45:00

标签: javascript jquery asp.net-mvc datatable datatables

我使用jQuery Datatable列出记录并添加Action按钮(编辑)以编辑模式对话框中的记录。如果我选择一行,我可以获取行id值并在模态对话框中打开相关记录。但是,如果我直接单击Edit按钮,则无法获取相关记录的Id值(在同一行),因为单击Edit按钮时未选中该值。我想要做的是:我想获得我单击编辑按钮的行的Id值。可能吗?如果没有,我可以在单击Edit按钮时以编程方式选择悬停行吗? (如果先前的情况是可能的,我会更喜欢它)。有什么想法吗?

function openModal() {

    var table = $('#dtbListAccount').DataTable();
    var oRow = $('this').parents('tr')[0];
    var oData = table.fnGetData(oRow);

    //code omitted for brevity
};

enter image description here

4 个答案:

答案 0 :(得分:9)

您可以使用此代码来实现此目的。

var table;
$(document).ready( function () {
 table  = $('#example').DataTable();
} );

$('body').on('click', '#btnEdit', function(){
    //to get currently clicked row object
    var row  = $(this).parents('tr')[0];

    //for row data
    console.log( table.row( row ).data() );

});

它会将行数据作为字符串数组返回。

Live Demo Here

使用浏览器控制台查看结果。

答案 1 :(得分:3)

这是完整的源代码。希望这会有所帮助:)

test obj = new Program();
//when button (edit button here) is clicked.... Note: no need id for buttons too, just use <button> tag
$('table button').click(function() {
  var tr = $(this).closest('tr');
  var id = tr.children('td:eq(0)').text(); //get the text from first col of current row
  console.log(id); //you'll get the actual ids here
});

答案 2 :(得分:0)

将行id分配给编辑按钮,为编辑按钮编写点击事件,根据点击按钮的ID,触发编辑功能/视图。

您可以在渲染自身时将行id分配给按钮,或者在页面加载时编写一个小功能。

答案 3 :(得分:-1)

如果id在父容器上,则找到它的值并使用它。如果它是兄弟姐妹,那么就这样做。