CODEWITHSUNDEEP
jquerydatatablestooltip
J. Neal
J. Neal

Reputation: 71

jQuery Tooltip in DataTables plugin

I want to make jQuery tooltip work with DataTables jQuery plugin and don't know how to attach it.

var myJBox = new jBox('Tooltip', {
   closeOnMouseleave: true,
   attach: '.tooltip',
   ajax: {
      url: 'tooltips/tooltip.jsp',
      reload: true,
      getData: 'data-ajax',
      setContent: true,
      spinner: true
   }
});

var oTable = $('#my-table').dataTable( {
    "searching": null,
    "info": false,
    "serverSide": true,
    "aoColumns": [
      {"sWidth": "25%", "sClass": "right", "bSortable": false },
      {"sWidth": "25%", "sClass": "left", "bSortable": false },
      {"sWidth": "25%", "asSorting": [ "desc", "asc" ] },
      {"sWidth": "25%", "asSorting": [ "desc", "asc" ] },
    ],
    "ajax": {
      "url": "ajax/my-table.jsp",
      "data": function ( d ) {
        d.variable = "1200";
      }
    }
} );

Does anyone have any idea how to make it work? Thank you

Upvotes: 0

Views: 124

Answers (1)

Stephan Wagner
Stephan Wagner

Reputation: 990

You need to attach it after the ajax call is made. Datatables doesn't have a callback on its ajax calls, but you can use the drawCallback method:

var oTable = $('#my-table').DataTable({
  // ...
  "drawCallback": function(settings) {
    myJBox.attach();
  },
});

Check out this fiddle, Here I attach the jBox to any td within the datatable: https://jsfiddle.net/StephanWagner/Lp6hb1v4/

Upvotes: 1

Related Questions