Replies

• allan Posts: 63,535Questions: 1Answers: 10,475 Site admin

  May 2017 edited May 2017

  Use the row().data() method to get the data for the row in question. The mouseover itself would be done like any other mouseover event in jQuery - for example:

  $('#myTable').on( 'mouseenter', 'tbody tr', function () {
    var rowData = table.row( this ).data();
     // ... show tool tip
  } );
  

  Note that I've used mouseenter rather than mouseover as it is more efficient - it won't cause a redraw evertime the mouse moves over a child element. Likewise, you would probably want to use mouseleave to tidy up the tooltip.

  Regards,
  Allan
• bindrid Posts: 730Questions: 0Answers: 119

  May 2017 edited May 2017

  Here is my version. It is slightly different than @allen . It also uses qtip2, a plugin I use for tooltips.

  I would have had this up early but nmci forced me to reboot.

  see it work here: http://jsbin.com/muhados/126/edit

  This assumes that the tooltip is in the dataset

              table = $('#example').DataTable({
  
                  // columns defined as noted above
                  columns: columns,
                  dom: "tp",
                  data: dataset.data,
                  // adding this is the minimum you need to do
                  createdRow: function ( row, data, index ) {
                      $("td:first", row).attr("title", data.tooltip);
                  }
              });
  
• allan Posts: 63,535Questions: 1Answers: 10,475 Site admin

  May 2017

  That's a nice approach - thanks for posting that. Using attributes can make it easier to tap into other libraries that expect those attributes to be there and let it work with the minimum of code.

  Its worth pointing that if the row's data is updated you would also need to update the attribute since createdRow is only triggered when the row is first created.

  Allan