Array
(
)

Como pegar o ID de cliente de uma coluna oculta em um DataTable jquery ?

Adriano Cordeiro
|
MVP
Pontos: 200
    16 set 2015

Bom dia!,
Como pegar o Id do cliente de um DataTable sendo que essa coluna está oculta ? Quando eu clicar na linha do DataTable vou precisar desse ID.
#Código

@model IEnumerable<Dominio.Entidade.TBCliente>

@{
    ViewBag.Title = "CLIENTE";
    Layout = "~/Areas/Administrativo/Views/Shared/_AdministrativoLayout.cshtml";
}

<table id="tblCLiente" class="table table-hover table-bordered table-condensed table-responsive table-striped small">
    <thead>
        <tr>
            <th>ID</th>
            <th>NOME</th>
            <th>TIPO</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>


@section Scripts {
    <script src="//cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
    <script src="//cdn.datatables.net/1.10.9/js/dataTables.bootstrap.min.js"></script>
    <link href="//cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" rel="stylesheet" />

    <script type="text/javascript">

        $(document).ready(function () {

            $("#tblCLiente").DataTable({
                "bProcessing": true,
                "bServerSide": true,
                "scrollY": "50vh",
                "scrollCollapse": true,

                "language": {
                    "lengthMenu": "Exibir _MENU_ registros por páginas",
                    "zeroRecords": "NÃO LOCALIZADO",
                    "info": "Exibir de _PAGE_ até _PAGE_",
                    "infoEmpty": "REGISTRO NÃO LOCALIZADO!",
                    "infoFiltered": " (de um total de_MAX_ registros.)",

                },
                "sAjaxSource": "BuscarCliente",
                "aoColumns": [
                                { "sName": "TBCLIENTEID", "mData": "TBCLIENTEID", "bVisible": false },
                                { "sName": "NMCLIENTE", "mData": "NMCLIENTE" },
                                { "sName": "TPCLIENTE", "mData": "TPCLIENTE" }
                ],
                "sPaginationType": "full_numbers"
            });

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

            

            $('#tblCLiente tbody').on('click', 'tr', function () {
                if ($(this).hasClass('selected')) {
                    $(this).removeClass('selected');
                }
                else {
                    table.$('tr.selected').removeClass('selected');
                    $(this).addClass('selected');
                }
            });

            $('#button').click(function () {
                table.row('.selected').remove().draw(false);
            });

            

        });

    </script>
}

Aqui a Action:
#Código
        public JsonResult BuscarCliente()
        {
            string echo = Request.Params["sEcho"].ToString();
            string iColumns = Request.Params["iColumns"].ToString();
            string sColumns = Request.Params["sColumns"].ToString();
            int iDisplayStart = int.Parse(Request.Params["iDisplayStart"].ToString());
            int iDisplayLength = int.Parse(Request.Params["iDisplayLength"].ToString());
            string mDataProp_0 = Request.Params["mDataProp_0"].ToString();
            string sSearch = Request.Params["sSearch"].ToString();
            string iSortCol_0 = Request.Params["iSortCol_0"].ToString();
            string sSortDir_0 = Request.Params["sSortDir_0"].ToString();
            string iSortingCols = Request.Params["iSortingCols"].ToString();
            string bSortable_0 = Request.Params["bSortable_0"].ToString();
            int regExibir = iDisplayLength;
            int startExibir = iDisplayStart;

            List<TBCliente> lClienteFiltrado = new List<TBCliente>();
            List<TBCliente> lTotalCliente = _IRepositorio.ListarCliente();

            if (!string.IsNullOrWhiteSpace(sSearch))
            {
                lClienteFiltrado = lTotalCliente.Where(x => x.NMCLIENTE.ToUpper().Contains(sSearch.ToUpper())).ToList<TBCliente>();
            }
            else
            {
                lClienteFiltrado = lTotalCliente;
            }

            if (iDisplayStart > lClienteFiltrado.Count)
                startExibir = 0;
            if (iDisplayStart + iDisplayLength > lClienteFiltrado.Count)
                regExibir = lClienteFiltrado.Count - startExibir;

            if (sSortDir_0 == "asc")
            {
                if (iSortCol_0 == "0")
                    lClienteFiltrado = lClienteFiltrado.OrderBy(x => x.TBCLIENTEID).ToList<TBCliente>();
                if (iSortCol_0 == "1")
                    lClienteFiltrado = lClienteFiltrado.OrderBy(x => x.NMCLIENTE).ToList<TBCliente>();
                if (iSortCol_0 == "2")
                    lClienteFiltrado = lClienteFiltrado.OrderBy(x => x.TPCLIENTE).ToList<TBCliente>();
            }
            else
            {
                if (iSortCol_0 == "0")
                    lClienteFiltrado = lClienteFiltrado.OrderByDescending(x => x.TBCLIENTEID).ToList<TBCliente>();
                if (iSortCol_0 == "1")
                    lClienteFiltrado = lClienteFiltrado.OrderByDescending(x => x.NMCLIENTE).ToList<TBCliente>();
                if (iSortCol_0 == "2")
                    lClienteFiltrado = lClienteFiltrado.OrderByDescending(x => x.TPCLIENTE).ToList<TBCliente>();
            }

            var Resultado = new
            {
                sEcho = echo,
                iTotalRecords = lTotalCliente.Count,
                iTotalDisplayRecords = lClienteFiltrado.Count,
                //iDisplayLength = 10,
                aaData = lClienteFiltrado.ToList<TBCliente>().GetRange(startExibir, regExibir)
            };
            return Json(Resultado, JsonRequestBehavior.AllowGet);
        }

Hector Figueroa
   - 16 set 2015

Adriano, já fiz algo parecido, quando eu clicava em uma linha da tabela executava isso ^^

#Código

 var row = $(this).parents('td')[0];
 var pos = table.fnGetPosition(row);

 valor = table.fnGetData(pos[0])['A COLUNA OCULTA'];

Adriano Cordeiro
|
MVP
Pontos: 200
    16 set 2015

Hector,
Implementei mas não ocorre nenhum efeito, será que a sintaxe do evento click está correta ?

#Código

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

                var row = $(this).parents('td')[0];
                var pos = table.fnGetPosition(row);
                valor = table.fnGetData(pos[0])['TBCLIENTEID'];

                alert(valor);
            });

Obrigado!

Hector Figueroa
   - 16 set 2015

faz uns teste com esse aqui

#Código

    $('#example tbody').on('click', 'a', function () {        
        
        var row = $(this).parents('td')[0];
        var pos = oTable.fnGetPosition(row);

        valor = oTable.fnGetData(pos[0])['NOME COLUNA'];
        
    });

Adriano Cordeiro
|
MVP
Pontos: 200
    16 set 2015

a diferença é que nesse último exemplo foi trocado a tag #Código

tr
pela tag #Código
a
, porém devo clicar na linha da tabela, ou seja na tag 'tr' para encontrar o valor do Id do Cliente, ainda continuo sem saber como pegar o valor da coluna oculta do DataTable.

Adriano Cordeiro
|
MVP
Pontos: 200
    16 set 2015

Encontrei a solução e fic ai pra quem passar pela mesma situação que eu, a solução foi adicionar o valor do id cliente para o atributo #Código

id
para do parâmetro #Código
"rowCallback":
da requisição ajax:

e depois recuperar no click da linha:

#Código
$('#tblCLiente tbody').on('click', 'tr', function () {
            var id = this.id;
            if ($(this).hasClass('selected')) {
                $(this).removeClass('selected');
            }
            else {
                table.$('tr.selected').removeClass('selected');
                $(this).addClass('selected');
            }
        });

        $('#button').click(function () {
            table.row('.selected').remove().draw(false);
        });