JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="//cdn.datatables.net/1.10.0/css/jquery.dataTables.css">
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.js"></script>
<table id="floortable" border=1 class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Floor</th>
<th>Bldg</th>
<th>Suite #</th>
<th>Sq FT</th>
<th>Rent</th>
<th>Status</th>
<th>Space Used</th>
<th>floor</th>
</tr>
</thead>
</table>
JavaScript
var table2 = $('#floortable').DataTable({
"bPaginate": true,
"bSearchable": false,
"bInfo": false,
"bFilter": false,
"stateSave": true,
"stateDuration": 10,
"aoColumnDefs": [{
"aTargets": [7],
"mRender": function (data, type, full) {
return '<input class="button" type="button" onclick="alert(full[3])">button</input> ';
}
}]
});
var table = [];
var row = [];
row = [1, 3, 22, 32, 'gone', 'vacant',0];
table.push(row);
var row = [];
row = [1, 3, 22, 32, 'gone2', 'vacant',0];
table.push(row);
//alert(table);
table2.rows.add(table).draw();
$("#floortable").on("click", ".button", function() {
console.log($(this).parents("tr"));
console.log(table2.row($(this).parents("tr")).data());
});