add tooltip to specific column of datatables

Question

I have table defined in html as <table id="tableDynamic"></table>

And I am updating table dynamically as

    $('#tableDynamic').DataTable( {
        columns: [
            { title: data[0] },
            { title: data[1] },
            { title: data[2] },
],

        "columnDefs": [
            {
                "render": function (data, type, row){
                    return '<a>' + row[0]  +'</a>';

                },
                "targets": 0
            },
        ]
    } );
}

How can I add tooltip just to specific column data[2]

this one worked too $("#tableDynamic > thead > tr > th:nth-child(3)").tooltip({title:"tooltipText"}); — user2661518
– user2661518, Commented Apr 26, 2017 at 19:11
For version 2.3.2, I was able to just add a tooltip to a header in the columnDefs like this: title: '<span title="My Tooltip">Header</span>',. I played around with doing it dynamically, and it also seemed to work, but your mileage may vary. Try this: title: <span title="My Tooltip">${data[2]}</span> — user1544428
– user1544428, Commented Aug 14 at 16:06

Syl20 · Accepted Answer · 2017-12-12 14:42:49Z

1

You could also do it like this (call any other javascript after Datable initialisation is complete):

 $('#tableID').DataTable({

    [...]

   fnDrawCallback: function(oSettings, json) {
      //Call JS here
      alert( 'DataTables has finished its initialisation.' );        
      tooltip('.selector', 'theme');
    }

  });

I asked a somewhat similar question here. Look at YouneL answer for more details, and an example to do the same with a call back.

edited Dec 12, 2017 at 14:42

answered Dec 12, 2017 at 14:16

Syl20

1173 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

add tooltip to specific column of datatables

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related