javascript - 使用上下文菜单单击 DataTable 行

Question

我想为我的 DataTable 的每一行添加一个上下文菜单。

我想获取被单击的行，然后通过某种方式来识别它(我想包含主键的第一个单元格值可以工作)，然后发送包含 PK 和单击的选项的 AJAX 请求。

我已经弄清楚如何使用“tr”作为选择器来获取行，但是如何获取第一个单元格的值(其中包含主键)。这会打印出所有单元格:

$(function(){
    $.contextMenu({
        selector: 'td', 
        trigger: 'right',
        callback: function(key, options) {
            var  m = $(options.$trigger).text();
            window.console && console.log(m) || alert(m);
        },
        items: {
            "delete": {name: "Delete", icon: "delete"},
    }); 
});

另外，这是最好的方法吗？我计划在上下文菜单中提供大约 10 个与行交互的选项。我使用 Django 作为后端。

Answer 1

当您想要与 DT 交互时，请始终使用 API。如果您有实例

var table = $('#example').DataTable( {..} )

然后通过传递 options.$trigger 检索当前行其中包含 <tr>节点:

$.contextMenu({
  selector: 'tr', 
  trigger: 'right',
  callback: function(key, options) {
    var row = table.row(options.$trigger)
    switch (key) {
      case 'delete' :
        row.remove().draw()
        break;
      case ...
    } 
  },
  items: {
    'delete': { name: 'Delete', icon: 'delete' },
    ...
  }
}) 

but how can I get the 1st cell's value (which contains the primary key).

row.data()[0]

演示 -> http://jsfiddle.net/z2q5scgr/