CODEWITHSUNDEEP
javascriptjqueryarraysobjecthtml-table
Davide
Davide

Reputation: 136

Parsing this table with Javascript into array of objects

I have this source table data:

Table source data

And I would like to get data parsed like this (grouped by row):

Table destination data

I grouped source table into an array of objects. This is my array:

[ { rowId: 4, colId: 10 } { rowId: 4, colId: 11 } .... ]

Now I would like to get an array of parsed objects..

How can I do this? I parsed the array with a for loop but I got some error when I create the new array of objects..

My code:

    for (var i=0; i<tableArray.length; i++) {

    if (tableArray[i].rowId != rowLast) {
        bar = true;     
        var row = tableArray[i].rowId;
        var start = tableArray[i].colId;
    }

    if  ((bar)&&(tableArray[i].colId != colLast)) {
        var end = tableArray[i].colId;
        tab = { row: row, start: start, end: end }
        newTableArray.push(tab);
        bar = false;
    }


    rowLast = tableArray[i].rowId;
    colLast = tableArray[i].colId;      

}

Help! I'm a bit confused in loop :(

Many thanks.

Upvotes: 1

Views: 166

Answers (2)

Nina Scholz
Nina Scholz

Reputation: 386728

You could group the elements and use an object for the last values. This solution needs sorted data.

var array = [{ rowId: 4, colId: 10 }, { rowId: 4, colId: 11 }, { rowId: 4, colId: 12 }, { rowId: 4, colId: 20 }, { rowId: 4, colId: 21 }, { rowId: 6, colId: 6 }, { rowId: 6, colId: 7 }, { rowId: 6, colId: 8 }, { rowId: 7, colId: 12 }, ],
    group = [];

array.forEach(function (a, i) {
    if (!i ||                          // group changes if first object i = 0
        this.last.row !== a.rowId ||   //               or different rowId
        this.last.end + 1 !== a.colId  //               or not in sequence
    ) {
        this.last = { row: a.rowId, start: a.colId, end: a.colId };
        group.push(this.last);
    }
    this.last.end = a.colId;
}, {});

console.log(group);

Upvotes: 1

Danmoreng
Danmoreng

Reputation: 2367

I would rather write a function to generate the new array, I hope the comments explain the thought process behind it:

function transform(array) {
    var output = [];
    // initiates the first object you want in your output array
    // with the row and colId of the first object from the input array
    var obj = {
        row: array[0].row,
        start: array[0].colId,
        end: array[0].colId
    };
    // Loop starts at 1 instead of 0 because we used the first object array[0] already
    for (var i = 1; i < array.length; i++) {
        var current = array[i];
        // if the current objects row is still the same,
        // AND the colId is the next colId (meaning no spare cols between)
        // set the new objects end to this colId
        if(obj.row === current.row && (current.colId - obj.end) === 1 ){
            obj.end = current.colId;
        }
        // when the row does not match, add the object to the output array and
        // re-innitiate it with the current objects row and colId
        else {
            output.push(obj);
            obj.row = current.row;
            obj.start = current.colId;
            obj.end = current.colId;
        }
    }
    // Once the loop is done, add the last remaining object to the output array
    output.push(obj);
    return output;
}

Upvotes: 1

Related Questions