在JQuery中读取隐藏列的值 [英] Read Value of Hidden Column in JQuery

问题描述

我需要在表上隐藏一列，但此后我无法读取所选行的隐藏列值.

I need to hide a column on the table, but after that I cannot read selected row's hidden column value.

 dtTable = $('#lookupTable').DataTable({
       "columnDefs": [
           {
               "targets": [ 0 ],
               "visible": false,
               "searchable": false               
           }
        ],  

        aaData: data,
        aoColumns: cols,
        paging: false,
        scrollCollapse: true,
        destroy: true

    });

您看到的第一列现已隐藏.我正在尝试使用该代码读取列值

as you see the first column is hidden now. And I am trying to read the column value with that code

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

如果我从代码中删除<"visible":false>，我可以读取第一列的值，但是如果它被隐藏，则为我提供第二列的值.

if i delete <"visible": false> from the code i can read the first column's value, but if it is hidden it gives me second column value.

我厌倦了更改"witdh"属性，但是没用..

I tired to change "witdh" property but it didnt work..

推荐答案

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

The CSS selector wont work, because "visible": false in your columnDefs does not mean that the column gets the equivalent display: none; style property in the markup.

相反，您必须使用DataTables API才能在隐藏列中获取数据.

Instead, you'll have to use the DataTables API to get the data in the hidden column.

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

The function fnGetData will do the trick. It returns the text data in the cell that is passed as an argument to the function.

这里是文档中的示例

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

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

In your case, the column is hidden, thus you'll have to combine it with a second API call. Say that you click the row with the hidden first column, you can combine the fnGetData with the fnGetPosition function.

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

查看文档，其中有一些很棒的例子.

Check the documentation, it has some great examples.

fnGetData()

fnGetPosition()

这是工作代码

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

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

这篇关于在JQuery中读取隐藏列的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！