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

查看:23
本文介绍了读取 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 选择器不起作用,因为 "visible": false 在您的 columnDefs 中并不意味着该列在标记中获得等效的 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 调用结合起来.假设您单击隐藏第一列的行,您可以将 fnGetDatafnGetPosition 函数结合起来.

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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆