Hello,
I'm still new to Javascript, so any apologies if I missed anything. I have JSON data being passed to DataTables. Currently, I can click on a row to fetch all the data for that particular row. However, now I need to do almost the same thing but rather than click on the row, I'll need to render a specific column that still displays its data and have a link that will capture all the data for that particular row.
I've gotten the render to show "data" but I can't get it to show the data its suppose to show. For instance Case Number: "1234" should show "1234" but it shows "data". Then the link needs to be able to fetch that row's data.
Below is the current code I have:
// READY FUNCTION
$(document).ready(function() {
var obj = $('#tempDataForm').serializeJSON();
query('discrepancyList',obj,refreshDiscrepancyTable,0,"queryDiscrepancy.php");
});
function refreshDiscrepancyTable(response) {
if(response.result.state == 'success') {
var refreshedData = response.result.data.results;
var colNames = response.result.data.colNames;
if ( $.fn.DataTable.isDataTable('#discrepancyQueue') ) {
$('#discrepancyQueue').DataTable().destroy();
}
$('#discrepancyQueue').DataTable( {
data: refreshedData,
``` // Allows row to be clicked to capture rows data
"fnDrawCallback": function( oSettings ) {
$('#discrepancyQueue').on( 'click', 'tr', function () {
var table = $('#discrepancyQueue').DataTable();
// Gets the row values
var rawData = table.row( this ).data();
var data = (JSON.stringify(rawData));
});
},```
columns: colNames,
responsive: true,
// Hides "Id" columns and makes it not searchable
"columnDefs": [
{
"targets": [ 0 ],
"visible": false,
"searchable": false
},
```{
"targets": [ 1 ],
"data": "Case Number",
"render": function ( data, type, row, meta ) {
return '<a href="'+data+'">data</a>';
}
} ```
]
});
var myTable = $('#discrepancyQueue').DataTable();
notify('success','Test!');
} else {
notify('warn','Error!');
}
}
Any help on this would be greatly appreciated.
