jQuery DataTables获取隐藏的列数据

时间:2017-08-02 15:10:01

标签: jquery datatables

$("#TransactionTable").DataTable({
                    ajax: {
                        url: '/Transaction/SearchMockup',
                        type: 'POST',
                        data: {
                            cardEndingWith: $("#ccn").val(),
                            status: $("#status").val(),
                            supplier: $("#supplier").val(),
                            fromDate: $("#fromDate").val(),
                            toDate: $("#toDate").val()
                        }
                    },
                    columns: [
                    {
                    { data: 'Status' },
                    { data: 'TransactionId' },
                    { data: 'CreditCardNumber' },
                    { data: 'Supplier' },
                    { data: 'CreatedAt' },
                    { data: 'Amount' },
                    { data: 'Guid' }
                    ],
                    columnDefs: [
                    {
                        "targets": [6],
                        "visible": false,
                        "className": "guid"
                    },
                    {
                        "targets": [1],
                        "className": "transactionIdColumn",
                    }
                    ]
                });

有那个表定义,想点击“TransactionId”列,获取隐藏的“Guid”列的值/数据。您可以看到我的guid列具有名为“transactionIdColumn”的类名。需要有关jQuery Code的帮助。

尝试做这样的事情:

$("#TransactionTable .transactionIdColumn").on('click', function (elm) {
                var guidNumber = $(elm).closest("tr").find(".transactionIdColumn").html();
                alert(guidNumber);
            });

enter image description here

1 个答案:

答案 0 :(得分:1)

你可以试试这个。

{ "data"  : "TransactionId",
  "render": function (data, type, full, meta) {
              var guid = full['guid'];
              return '<a href="#" class="trans_id" data-guid="'+guid+'"> '+data+' </a>';
            }
},

以下是datatables.render

的链接
 $("#TransactionTable .trans_id").on('click', function (elm) {
     var guidNumber = $(this).data('guid');
     alert(guidNumber);
 });