Question

我需要在表格中隐藏一列，但之后我无法读取所选行的隐藏列值。

    selectedIndex = $(this).find('td:eq(0)').text();

如您所见，第一列现在已隐藏。我试图用该代码读取列值

{{1}}

如果我删除＆lt;“visible”：false＆gt;从代码我可以读取第一列的值，但如果它被隐藏它给我第二列值。

我厌倦了改变“witdh”财产，但它没有工作......

Answer 1

CSS选择器不起作用，因为"visible": false中的columnDefs并不意味着该列在标记中获得了等效的display: none;样式属性。

相反，您必须使用DataTables API来获取隐藏列中的数据。

函数fnGetData可以解决问题。它返回作为参数传递给函数的单元格中的文本数据。

以下是文档中的示例

oTable.$('td').click( function () {
    var sData = oTable.fnGetData( this );
    alert( 'The cell clicked on had the value of '+sData );
});

在您的情况下，该列是隐藏的，因此您必须将其与第二个API调用相结合。假设您单击隐藏第一列的行，您可以将fnGetData与fnGetPosition函数合并。

var position = dtTable.fnGetPosition(this);
var hiddenColumnValue = dtTable.fnGetData(position)[0];

查看文档，它有一些很好的例子。

fnGetData()

fnGetPosition()

这是工作代码

  $('#lookupTable tbody').on('click', 'tr', function () {

        selectedIndex = dtTable.row(this).data()[0];   
 });

Answer 2

浏览dataTables API，您可以通过多种方式以正确的方式从隐藏列中检索数据。例如，您可以使用cells。正如您在链接中看到的那样，您可以使用cells的所有类型的选择器，就像jQuery选择器一样。

这是一个非常简单的示例，它记录了已隐藏的第一列的值：

var dtTable = $('#example').DataTable()  

dtTable.columns([0,1,2]).visible(false);

for (var i=0;i<10;i++) {
    console.log(dtTable.cells({ row: i, column: 0 }).data()[0]);
}

<强> http://jsfiddle.net/oumtdd6k/

它不能被强调：总是通过API，不要尝试在初始化的dataTable上使用传统的jQuery !!

在这种情况下，原因很明显：jQuery只能访问DOM中实际存在的元素。当您隐藏dataTables中的列时，它们不会像display: none中那样隐藏，它们就不会被渲染！

Answer 3

正确答案很旧。因此，如果正确的答案对您不起作用。请尝试这种方法：

selectedIndex = dtTable.row(this).data();

此代码将返回为该行获取的原始json对象。像这样：

{
   "modify":"false",
   "lastModify":"Tuesday",
   "name":"abc",
   "DT_RowId":"row_1",
   "fileID":"0bde976"
}

要获取“ fileID”，您只需：

alert("ID = "+selectedIndex.fileID);

Answer 4

var dtTable = $('#test').DataTable()

      $('#test tbody').on('click', 'tr td .fa-pencil', function (e) {
                    ID = (dtTable.row($(this).closest('tr')).data().Id);
});

`

Answer 5

另一个解决方案是添加CSS类ID Fiekd Visbilety hideen和$（this）.find（'td：eq（0）'）。text（）;检索值。

Answer 6

var table= $('#tablename').DataTable();

var hiddenColumnData1 = table.row('#trIdName').data()[1];
var hiddenColumnData2 = table.row('#trIdName').data()[2];

console.log("First Hidden Column Data of 'trIdName' : "+hiddenColumnData1) 
console.log("Second Hidden Column Data of 'trIdName' : "+hiddenColumnData1)

Answer 7

传统的jQuery无法在datatable上运行，您必须使用API定义的方法来获取值。就我而言，这可以很好地使每行上的按钮单击获得隐藏的列值-

$(function () {
       var t = $('#mytableid').DataTable({
            "columnDefs": [{
                "searchable": false,
                "orderable": false,
                "visible":false,
                "targets": [0]
            }]
        });

        $('#mytableid').on('click', '.btnClass', function () {
            var currentRow = $(this).closest("tr");
            var columnvalue = t.row(currentRow).data()[0];
            console.log(columnvalue);
        });
});

Answer 8

由于它很旧，所以添加了这个内容，没有一个答案具有我习惯的快速，干净的jquery格式。您可以使用传统的jquery选择器，即使您尝试访问的对象当前未在DOM中呈现（即隐藏或在另一页上），也可以通过将其作为Datatable的方法来实现。因此，在您的情况下：

dtable.$("yourJQuerySelector")

这将选择您习惯并适用于我的案例的元素。

在JQuery中读取隐藏列的值

8 个答案: