1

Tenho uma tabela gerada pelo datatables que mostra nome, documento e telefone. Ela funciona perfeitamente mais eu quero que apareça tooltip para mostrar informações adicionais, eu até consegui mostrar pegando o valor inserido no tr mais o problema e que as informações adicionais não vão aparecer e preciso de ajuda para isso pois meu conhecimento da biblioteca é limitado, segue abaixo o código:

tabela:

                  <table id="tabelaclientes" class="table table-bordered table-striped">
                <thead>
                  <tr>
                    <th>Nome</th>
                    <th>Documento</th>
                    <th>Telefone</th>
                    <th></th>
                  </tr>
                </thead>
              </table>

jquery:

    $(document).ready(function() {
/*
 * First step is to create title attributes for the rows in the table
 * This isn't needed if the required 'title' attribute is already set in the HTML in the
 * DOM 
 */


/* Init DataTables */
var oTable = $('#tabelaclientes').DataTable({
        "lengthMenu": [ [10, 25, 50, 100, -1], [10, 25, 50, 100, "Todos"] ],
        "processing": true,
        "serverSide": true,
        "oLanguage": {
            "sUrl": "busca/pt-br.txt"
        },

        "ajax": "busca/clientes.php",

        "fnDrawCallback": function( settings ) {
     $('#tabelaclientes tbody tr').each( function() {
    var sTitle;
    var nTds = $('td', this);
    var nome = $(nTds[0]).text(); 
    var documento = $(nTds[1]).text();
    var telefone = $(nTds[2]).text();
    var ie = $(nTds[4]).text();
    var endereco = $(nTds[5]).text();
    var bairro = $(nTds[6]).text();
    var uf = $(nTds[7]).text();
    var cidade = $(nTds[8]).text();
    var email = $(nTds[9]).text();
        sTitle =  'Nome da Empresa: ' +nome+ '\nCPF/CNPF: ' +documento+ '\nIE: ' +ie+ '\nEndereço: ' +endereco+ '\nBairro: ' +bairro+ '\nUF: ' +uf+ '\nCidade: ' +cidade+ '\nTelefone: ' +telefone+ '\nEmail: ' +email;


    this.setAttribute( 'title', sTitle );
} );
}

    });

/* Apply the tooltips */
oTable.$('tr').tooltip( {
    "delay": 0,
    "track": true,
    "fade": 250
} );

} );

recebo os dados assim:

{"draw":1,"recordsTotal":821,"recordsFiltered":821,"data":[["3 MARC IMPRESSOS GRAFICOS LTDA ME","02651657000144"
,null,"<a class='editar fancybox.iframe' href='cadastro_editar.php?id=574'><img src='imagens\/editar
.png' width='24px' height='24px' border=0  title='Editar acesso'\/><\/a><a class='permissao fancybox
.iframe' href='usuario_permissao.php?id=574'><img src='imagens\/recurso.png' width='24px' height='24px'
 border=0  title='Editar ficha pessoal'\/><\/a>",null,"R JOAO PINHEIRO, 613",null,"RJ",null,null]]}

1 Resposta 1

0

Depois de muito procurar achei uma solução para esta questão e volto aqui para compartilhar para que se alguém mais passar por este problema poder solucionar.

substitui isto:

var endereco = $(nTds[5]).text();

por isso:

var endereco = oTable.row(this).data()[5]; 

como o valor estava oculto na tabela eu não poderia pegar da mesma forma selecionando o td.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .