Multiple Arrays in DataTable

Question

So I am working on a project and am having trouble trying to use multiple arrays of data in a data table.

The issue I am running into is my initial set of data comes from a sharepoint list call(the calculations variable).

I then use values in that array to run some calculations and put those into their own array(formulatedNumbers).

I have my DataTable filling the first 6 columns with data fine(with the calculations array), the issue is getting the second array(formulatedNumbers) into the 7th column.

My javascript buiding the datatable is below

TL;DR After I use the first array to fill in columns 1-6, I want to use another array to fill in column 7.

function displayCalculations() {
    $("#table_id").dataTable().fnDestroy();
    var calculations = getRateData();
    var formulatedNumbers = [];

    for(i=0; i<calculations.length; i++) {
        formulatedNumbers.push(calculations[i].annum * calculations[i].dailyDecimal * 1000);
    }

    console.log(formulatedNumbers);

    $('#table_id').DataTable(
        {
            data: calculations,
            "columns": 
            [
                { "data": "startDate" },
                { "data": "endDate" },
                { "data": "dayTotal" },
                { "data": "annum" },
                { "data": "dailyRate" },
                { "data": "dailyDecimal" }
            ],
        }); 
}

nilsandrey · Accepted Answer · 2021-08-09 17:36:08Z

2

I suggest just adding the new attribute to each item in calculations.

function displayCalculations() {
    $("#table_id").dataTable().fnDestroy();
    var calculations = getRateData();

    calculations.forEach(item =>
        item.newField = item.annum * item.dailyDecimal * 1000);

    console.log(calculations);

    $('#table_id').DataTable(
        {
            data: calculations,
            "columns": 
            [
                { "data": "startDate" },
                { "data": "endDate" },
                { "data": "dayTotal" },
                { "data": "annum" },
                { "data": "dailyRate" },
                { "data": "dailyDecimal" },
                { "data": "newField" } // + ADDED
            ],
        }); 
}

edited Aug 9, 2021 at 17:36

answered Aug 9, 2021 at 17:02

nilsandrey

1,12011 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

OMGDrAcula Over a year ago

Ah okay I will give this a go and report back!

OMGDrAcula Over a year ago

So after the forEach the console.log returns undefined. I added a console log before it and it pulls the initial data in, but after the forEach is undefined.

OMGDrAcula Over a year ago

So I removed the calculations = part of your example and it worked! So answer will be accepted!

OMGDrAcula Over a year ago

No problem at all!

Thallius · Accepted Answer · 2021-08-09 16:52:32Z

2

Don’t create new array for the calculated values but add them to your other data

calculations = calculations.map(calculation =>
{
    return calculation.push(calculation.annum * calculation.dailyDecimal * 1000);
}

answered Aug 9, 2021 at 16:52

Thallius

2,6112 gold badges19 silver badges41 bronze badges

4 Comments

OMGDrAcula Over a year ago

I already accepted, but have an upvote! This would work as well. Adding to my data didn't occur to me only because well I haven't had uses for it enough. Appreciate the alternative answer!

OMGDrAcula Over a year ago

This would just push the values to the array with no key though correct?

Thallius Over a year ago

Yes, but datatables does not need a key. It uses index

OMGDrAcula Over a year ago

Indeed. Just wanted to confirm that!

Collectives™ on Stack Overflow

Multiple Arrays in DataTable

2 Answers 2

4 Comments

4 Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

4 Comments

Related