Passing nested objects / arrays into a bootstrap modal
Passing nested objects / arrays into a bootstrap modal
I'm using DataTables and one of my data contains nested objects / arrays and I want to display that object in a bootstrap modal, when user clicks the button.
Json:
updatecases: [
0: {Id: 15, RMAnummer: 795, DateTimeUpdates: "/Date(1556263322883)/",…}
1: {Id: 16, RMAnummer: 795, DateTimeUpdates: "/Date(1556267987163)/",…}
2: {Id: 17, RMAnummer: 795, DateTimeUpdates: "/Date(1556268003016)/",…}
3: {Id: 18, RMAnummer: 795, DateTimeUpdates: "/Date(1556272425950)/",…}
]
DataTable:
$('#OrdrerList').DataTable({
"processing": true,
"serverSide": true,
ajax: {
url: '@Url.Action("GetOpenRMA", "User")',
dataType: 'json',
contentType: 'application/json; charset=utf-8',
data: 'dataSet'
},
columns: [
{ data: "Status" },
{
data: "updatecases",
"render": function (data, type, row, meta) {
var output = "";
$.each(data, function (i, v) {
if (data.length > 0) {
output += "<br> ";
}
output += v.DateTimeUpdates;
output += v.LastUpdatesName;
})
return output;
}
},
]
});
I did some research, but still no luck:
I created the function :
function RMAHistorik(data) {
var output = "";
$.each(data, function (i, v) {
if (data.length > 0) {
output += "<br> ";
}
output += v.DateTimeUpdates;
output += v.LastUpdatesName;
})
return output;
}
And I modified my DataTable :
//DataTable stuff...,
{
data: "updatecases",
"render": function (data, type, row, meta) {
return '<a data-toggle="modal" data-target="#mymodal" onclick="RMAHistorik(' + "'" + data + "'" + ');" href="' + row.Id + '" data-id="' + row.Id + '">' + row.Id + '</a>';
}
}
Her is the code for opening modal, but I don't know how should I extract the data from my function into modal:
$('#mymodal').on('show.bs.modal', function (event) {
var link = $(event.relatedTarget) // link that triggered the modal
});
Can anyone please help me or point me into the right direction! or share some example from archive on something like this.