Having data from 2 arrays display
Having data from 2 arrays display

I have two arrays that I am attempting to display in a table using Datatables.
I am successfully able to display one of the arrays just the way I am intending to do. When trying to include another array to display data from I am running into errors.
For example here is a code snippet of the successful showing of 1 array:
const data = [{title: "Walk in", totalRevenue: 2002, growth: 3.2}, {title: "Retail", totalRevenue: 1231, growth: 2.2},
{title: "Hospital", totalRevenue: 5421, growth: 1.9},
{title: "Online", totalRevenue: 2442, growth: 3.2},
{title: "Fitness", totalRevenue: 8742, growth: 0.3}]
const otherData = [{newTitle: 'More data', newTotalRevenue: 2000, newGrowthRate: 3.2}]
var table = $('#example').DataTable({
rowCallback: function(row, data, index){
if(data[2] < 3){
$(row).find('td:eq(2)').css('background-color', 'red');
}
},
"columnDefs": [
{
"targets": [1, 2],
"className": 'dt-body-right'
},
],
data: data,
responsive: true,
paging: true,
searching: false,
bInfo: true,
"order": [[2, "desc"]],
"pageLength": 20,
columns: [
{
data: "title",
title: "Title",
},
{ data: "totalRevenue", title: 'Revenue' },
{ data: "growth", title: 'Revenue Growth' }
]
});
My array data is being displayed by having data: data in my datatable configuration. I've attempted to include a second array such called otherData and include it in my datatable such as : data: [data, otherData] but when doing so I am unable to display any data from either arrays.
Is there a way to display more then one array of data in datatables?
Here is a link to a jsfiddle:
Answers
The object keys don't match your
columns.data
definition oftitle
,totalRevenue
andgrowth
. They need to match or Datatables won't know which columns to place them and you will get Warning: Requested unknown parameter error. I'm guessing this is the error you are getting.Once you have the objects matching you can add the second array using
rows.add()
.Kevin