How to loop conditionally to map header rows to data rows

Viewed 590

If I have two types of rows:

header rows and data rows. and any row should compose of 18 columns.

The number of data rows is based on the number of header rows for example:

If I have 2 header rows, I should have (2 datarows: the first one map to the first header row, the second one map to the second header row + 2 datarows: the first one map to the first header row, the second one map to the second header row + 1 data rows for total: maps to the first header row ) = 5 datarows per group

If I have 3 header rows, I should have (3 datarows: the first one map to the first header row, the second one map to the second header row, the third one maps to the third header row + 3 datarows: the first one maps to the first header row, the second one maps to the second header row, the third one mapss to the third header row + 1 for total: maps to the first header row) = 7 datarowsper group

and so on

NOTE: ALWAYS I SHOULD HAVE ONE DATA ROW FOR THE TOTAL DATA ROWS.

I want to loop over the columns of the data rows and map to the related header col data:

"render": function (data, type, full, meta) {

           let tooltip = isNaN(data) ? data : Number(data);

           return type === 'display' ? '<div  id="tooltip" data-tooltip="' +parsedData.columns[meta.col].toString().split("-")[0] + " = " + tooltip + "|" + meta.row + '">' + data : data;
    }

Let's take The second example: I have two header rows:

parsedData.columns = array[36] where 36 = 2 * 18 = number of header rows * number of columns per row.

There are multiple data rows one array for each data row = one row array[18]

meta.row = row index

The problem in my code is that it always maps to the first header row whatever the number of header rows.

To solve this problem I want to do a conditional loop.

so If the number of header rows = array[36] /18 = 2 header rows:

  • The first data row Iteration : parsedData.columns[meta.col].toString().split("-")[0]
  • the second data row iteration : parsedData.columns[meta.col-18].toString().split("-")[0]
  • The third data row Iteration : parsedData.columns[meta.col].toString().split("-")[0]
  • The fourth data row iteration : parsedData.columns[meta.col-18].toString().split("-")[0]
  • The fifth data row iteration:(for total) so the first parsedData.columns[meta.col].toString().split("-")[0]
and repeat this pattern for each group of row data(5 data rows per group), may I have 3 groups so I have 15 data rows

Based on comments here's an example:

enter image description here

528.00  -->Tooltip should = A1:528.00
52.80   -->Tooltip should = B9:52.80
240.00- -->Tooltip should = B10:240.00-
91.52   -->Tooltip should = T5:91.52

  • The header rows in this example = an array[36]
  • The data rows are multiple arrays(5) each array = array[18]

because I have 2 header rows ---> I have 5 data rows

2 + 2 + 1(total).

Now I Want to map every tool tip cell in the data rows to its equivalent of header rows as illustrated above. but it always maps to the first header row.

2 Answers

Initial note:

I'm not JavaScript specialist, but you've mentioned that you'll be glad even for C# solution...

As to your requirements...

...

header rows and data rows. and any row should compose of 18 columns

...

I Want to map every tool tip cell in the data rows to its equivalent of header rows as illustrated above. but it always maps to the first header row.

Assuming that the number of columns in a destination table is constant (18), an algorithm to find corresponing header addres is just clear mathematics:

public int[] GeHeaderAddress(int metaCol)
{
    int noOfColumns = 18;
    int currCol = (int)(metaCol%noOfColumns);
    int currRow = (int)(metaCol/noOfColumns);
    int[] address = new int[]{currRow,currCol};
    return address;
}

Usage:

int[] address = GeHeaderAddress(18);
//returns {1,0} //as the arrays are zero-based indexed

To find correspondence header we need to consider total header rows in our calculation.

Then the below javascript function will return the header location (meta.col)

function getHeaderCol(totalHeaderRows, dataRow, dataCol){
    const groupRows = (2 * totalHeaderRows) + 1
    const newDataRow = dataRow % groupRows
     return ((newDataRow % totalHeaderRows) * 18) + dataCol
    }
    
    console.log(getHeaderCol(2,4,10)) // result 10 , group 1
    console.log(getHeaderCol(2,5,10)) // result 10 , group 2
    
    

Related