Get the values from jQuery Datatable hidden columns

12,105

Use the code below:

$("#myTable").on('click', '#select', function (e) {
    e.preventDefault();  

    var currentRow = $(this).closest("tr");

    var data = $('#myTable').DataTable().row(currentRow).data();
    console.log(data['genero']);
    console.log(data['nivel_puesto']);

    // ... skipped ...
});
Share:
12,105
Admin
Author by

Admin

Updated on July 29, 2022

Comments

  • Admin
    Admin almost 2 years

    I have a jQuery datatable populated with info from a db' table and I have hidden two columns, now I need to get the value from the two hidden columns but I couldn´t, this is the code of my datatable and had set the property visible: false for the two last columns

        $('#myTable').DataTable({
            searching: false,
            paging: true,
            responsive: true,
            ordering: false,
            bInfo: false,
            bLengthChange: false,
            processing: true,
            info: false,
            deferRender: true,
            orderMulti: false,
            "ajax": {
                "url": "../home/CargarTabla?id=" + noDocumento,
                "type": "GET",
                "datatype": "json"
            },
            "columns": [
                    { "data": "nombres", "autoWidth": true, "orderable": false },
                    { "data": "apellidos", "autoWidth": true, "orderable": false },
                    { "data": "dui", "autoWidth": true, "orderable": false },
                    { "data": "numero_isss", "autoWidth": true, "orderable": false },
                    { "data": "cargo_participante", "autoWidth": true, "orderable": false },
                    { "data": "genero", "autoWidth": true, "orderable": false, "visible": false },
                    { "data": "nivel_puesto", "autoWidth": true, "orderable": false, "visible": false },
                    { "defaultContent": " <a href='#' id='select'>Modificar</a>  ", "autoWidth": true, "orderable": false }
            ],
            "oLanguage": {
                "sEmptyTable": "No hay registros disponibles",
                "sInfo": " _TOTAL_ registros. Mostrando de (_START_ a _END_)",
                "sLoadingRecords": "Por favor espera - Cargando...",
                "sSearch": "Filtro:",
                "sLengthMenu": "Mostrar _MENU_",
                "oPaginate": {
                    "sLast": "Última página",
                    "sFirst": "Primera",
                    "sNext": "Siguiente",
                    "sPrevious": "Anterior"
                },
                "oAria": {
                    "sSortAscending": ": Activar para ordenar la columna de manera ascendente",
                    "sSortDescending": ": Activar para ordenar la columna de manera descendente"
                }
            }
        });
    

    and this is the way I get the value from the columns that are visible to the user, it works just fine:

    $("#myTable").on('click', '#select', function (e) {
                e.preventDefault();  
                var currentRow = $(this).closest("tr");
                var Nombres = currentRow.find("td:eq(0)").text();
                var Apellidos = currentRow.find("td:eq(1)").text();
                var DUI = currentRow.find("td:eq(2)").text();
                var ISSS = currentRow.find("td:eq(3)").text();
                var Cargo = currentRow.find("td:eq(4)").text();
    
                alert(Nombres + Apellidos + DUI +ISSS+ Cargo);
            });
    

    But how I get the values from the hidden columns? I have tried this in the $("#myTable").on('click', '#select', function (e) with no success

     alert(table.row(this).data()[5]);
     alert(table.row(this).data()[6]);
    

    other way with no success

    var row = $(this).parents("td")[0];
    var pos = oTable.fnGetPosition(row);
    var Genero = oTable.fnGetData(pos[5])["idGenero"];
    

    and last

      var arr = $('#myTable').dataTable().fnGetData($(currentRow));
                var Genero = arr[5]; 
                var Nivel = arr[6];
    

    could you please help me to get the values from the hidden columns with the script code showed? BTW this is the HTML code

    <div class="table-responsive">
        <table class="table table-striped table-condensed" id="myTable" style="width:100%; margin:0 auto;">
            <thead>
                <tr>
                    <th>Nombres</th>
                    <th>Apellidos</th>
                    <th>DUI</th>
                    <th>ISSS</th>
                    <th>Cargo</th>
                    <th>Sexo</th>
                    <th>Nivel</th>
                    <th></th>
                </tr>
            </thead>
    
            <tbody></tbody>
        </table>
    </div>