Read hidden column value in jQuery

Question

I need to hide a column in a table, but after that I cannot read the value of the hidden column of the selected row.

 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 now hidden. And I'm trying to read the column value using this code

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

If I remove <"visible": false> from the code, I can read the first value of the column, but if it is hidden, it gives me the second value of the column.

I am tired of changing the "witdh" property, but it did not work.

Answer 1

The CSS selector does not work, because "visible": falsein yours columnDefsdoes not mean that the column gets the equivalent style property display: none;in the markup.

API DataTables .

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

API dataTables, . , 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, jQuery !!

: jQuery , DOM. , , display: none, !

Answer 3

. , . , :

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

This code will return the raw json object that was selected for this string. sort of:

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

To get the "fileID", you just need to:

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

Answer 4

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

Run code

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

Run code

''

Answer 5

Another task is to add a Css class identifier. Fiekd Visbilety hideen And $ (this) .find ('td: eq (0)'). Text (); Get the value ..

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)