Nov 20, 2022

# Solution 1 :

When populating the cells, append the cell value at the following conditions:

1. We are at the header row
2. We are at columns 1-6 (`colIndex` 0-5), or
3. We are at columns 7 or 8, given that column 6 has the value of “error”

Which we can select using this:

``````if( rowIndex == 0 || colIndex < 6 || (colIndex == 6 || colIndex == 7) && r[5].toLowerCase().trim() === "error") {
row.append(cell);
}
``````

Here’s a running demo (I’ve changed some parts of your code slightly):

``````data = [
['col1', 'col2', 'col3', 'col4', 'col5', 'col6', 'col7', 'col8'],
['jack', 'smith', '23', 'Y', 'Y', 'error', 'error_code', 'error_desc'],
['jack2', 'smith2', '232', 'Y2', 'Y2', 'no_error', 'error_code2', 'error_desc2']
];

function makeTable(container) {
var table = \$("<table/>");

\$.each(data, function(rowIndex, r) {
var row = \$("<tr/>");

\$.each(r, function(colIndex, c) {
var cellMarkup = "<t" + (rowIndex == 0 ? "h" : "d") + "/>";
var cell = \$(cellMarkup);
cell.text(c);

if (colIndex == 5) {
if (c.toLowerCase().trim() === "error") {
}
}

if (rowIndex == 0 || colIndex < 6 || (colIndex == 6 || colIndex == 7) && r[5].toLowerCase().trim() === "error") {
row.append(cell);
}
});
table.append(row);
});

return container.html(table);
}

makeTable(\$('.container'))``````
``````.error {
color: red;
}
/* oh god no ;-) */
}``````
``````<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container"></div>``````

# Problem :

I have a table with the following elements. Jack Smith is an example row. I have multiple rows as such.

``````col1    col2   col3      col4   col5     col6       col7       col8
jack    smith  23        Y        Y      error  error_code error_desc
``````

I am forming this table dynamically as shown below. My question is around col6, 7 and 8. There will be some rows that wouldn’t have col6 as error. I want col7 and col8 to be populated by error_code and error_desc only if col6 has an error. How can I achieve that? I am unsure of where to start from? Basically, I do not want to iterate over col7 and col8 if col6 does not have “error” value.

``````    var table = \$("<table/>");
\$.each(data, function(rowIndex, r) {
var row = \$("<tr/>");
\$.each(r, function(colIndex, c) {
var cellMarkup = "<t"+(rowIndex == 0 ?  "h" : "d")+"/>";
var cell = \$(cellMarkup);
cell.text(c);
if(colIndex == 5){   --> I am doing this to flag an error in red. Nothing related to the posed question.
if( \$.trim(c.toLowerCase() ) === "error" ){
}
}

row.append(cell);
});
table.append(row);
});

return container.html(table);

}
``````

Sidenote:

Another note:

### Comment posted by Nick

@agrm That is correct. I will use a zero based index to get to col6. Please read it as colIndex 5. I will update my original question as well. Do you have a solution in mind for my query?

### Comment posted by Nick

I tried what you mentioned. It does make sense. However, I want to understand what is the first condition for “rowIndex ==0 || colIndex <6". The solution didn't work for me. :(

### Comment posted by agrm

`rowIndex==0`

### Comment posted by Nick

Gotcha. I tried your solution. Thanks a lot for your recommendations. The records, where the col 6 has no error, doesn’t work. However, the records where col 6 has “error”, works well.

### Comment posted by Nick

Do you have further comments? I am stuck at this stage