So am trying to populate an expandable data table with the data of the child and parent from different queries as shown below in my controller.
public function data()
{
$users = User::get(['first_name']);
return Datatables::of($users)
->make(true);
$roles = Campaign::get(['campaign_name']);
return Datatables::of($roles)
->make(true);
}
The thing is with the ajax request i can only get one result, that is the one for the parent, but yet ad like to get both results so that on clicking the expand button one can be able to view more details. here is my js code
function format(d) {
return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">' +
'<tr>' +
'<td>Campaign Name:</td>' +
'<td>' + d.campaign_name + '</td>' +
'</tr>' +
'<tr>' +
'<td>Company:</td>' +
'<td>' + d.company + '</td>' +
'</tr>' +
'<tr>' +
'<td>Extra info:</td>' +
'<td>And any further details here (images etc)...</td>' +
'</tr>' +
'</table>';
}
$(document).ready(function() {
var table = $('#example').DataTable({
"ajax": "",
"columns": [{
"className": 'details-control',
"orderable": false,
"data": null,
"defaultContent": ''
}, {
"data": "first_name"
} {
"data": "campaign_name"
}],
"order": [
[1, 'asc']
]
});
// Add event listener for opening and closing details
$('#example tbody').on('click', 'td.details-control', function() {
var tr = $(this).closest('tr');
var row = table.row(tr);
if (row.child.isShown()) {
// This row is already open - close it
row.child.hide();
tr.removeClass('shown');
} else {
// Open this row
row.child(format(row.data())).show();
tr.addClass('shown');
}
});
});
Please help out
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire