Having data from 2 arrays display

Having data from 2 arrays display

oristephoristeph Posts: 6Questions: 6Answers: 0

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

  • kthorngrenkthorngren Posts: 21,172Questions: 26Answers: 4,923
    edited August 2020

    const otherData = [{newTitle: 'More data', newTotalRevenue: 2000, newGrowthRate: 3.2}]

    The object keys don't match your columns.data definition of title, totalRevenue and growth. 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

This discussion has been closed.