define([ 'jquery', 'https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/sl-1.3.0/datatables.min.js' ], function($, DataTables) { "use strict"; function DataTablesSimpleList() {} DataTablesSimpleList.prototype.draw = function(oControlHost) { $('') .appendTo('head') .attr({ "type": 'text/css', "rel": 'stylesheet', "href": 'https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css' }); let htmlElement = oControlHost.container; htmlElement.innerHTML = '
'; let queryData = [ [-2, 'Name 1'], [-56.3, 'Name 2'], [6.1, 'Name 3'], [100, 'Name 4'], [13.8, 'Name 5'], [0, 'Name 6'], [-15.2, 'Name 7'], [0.86, 'Name 8'], [-4.8, 'Name 9'], [-33.6, 'Name 10'], [-75.2, 'Name 11'], [48, 'Name 12'], [66.6, 'Name 13'], [22.5, 'Name 14'], [-49.9, 'Name 15'], [-98.6, 'Name 16'] ]; $(document).ready(function() { let tableNode = $('#example'); let table = tableNode.DataTable({ "paging" : false, "select": { "style": 'single', "items": 'cell' }, "order": [], "data": queryData, "columns": [ {"title": "Activity", "sClass": "center"}, {"title": "Name", "sClass": "center"} ] }); table.on('draw', function() { console.log('Table redraw'); }); table.on('select', function(e, dt, type, indexes) { console.log('Table select'); if (type === 'cell') { let cell = dt.cell({ selected: true }); if(cell.index().column === 0) { console.log(cell.data()); } else if(cell.index().column === 1) { console.log(cell.data()); } cell.deselect() } }); }); }; return DataTablesSimpleList; } );