How to change an icon in a html table TD element, according to another TD element in jquery?

Question

this is my table in jquery:-

var tbody = $('#tblCsvRecords tbody'),
props = ["ShipmentType", "SCAC", "ShipmentControlNumber", "ProvinceofLoading", 
"ShipperName", "ConsigneeName"];
$.each(filedata, function (key, value) {
var tr = $('<tr>');
$.each(props, function (key, prop) {
$('<td>').html(value[prop]).appendTo(tr);
});
tbody.append(tr);
});

this is validation in jquery-

$.each(globalfiledata, function (key, value) {
if (value.ShipmentType != ("Regular Bill" || "Section 321")) {
           //show error sign and view error link as shown in image
}
}); 

html table -

<div id="tablediv" class="table-responsive">                                           
<table id="tblCsvRecords" class="table table3-1 bg-white no-margin-bottom">
<thead>
<tr>
<th>Shipment Type </th>
<th>SCAC </th>
<th>Shipment Control Number </th>
<th>Port of Loading </th>
<th>Shipper Name </th>
<th>Consignee Name </th>
<th>Validated </th>
</tr>
</thead>
<tbody>
</tbody>
</table id>
</div>

I want to display the error sign and the view error link for the popup in the validated column of the table. How can I do that? image of validated column of the table

I want to display error message in the modal -"enter valid shipment type" if Iserror is true how should i do that? below is the working updated code-

Answer 1

So, you don't need to iterate over globalfiledata for the validation. You can do the validation when you're building the table, here:

$.each(filedata, function (key, value) {
    var tr = $('<tr>');
    var isError = false; //set isError false at the beginning of every row iteration
    $.each(props, function (key, prop) {
         //do your validation here
         if(prop === "ShipmentType" && value !== ("Regular Bill" || "Section 321")) {
            isError = true;
        }
        $('<td>').text(value).appendTo(tr); //fixed this line in your code to match your data structure, and to actually write the value to the td text because it's not html
    });
    //then, the last column is for Validation, so add your validation td here:
    var td = $('<td>');
    if(isError) {
        //insert your error image and link here, which will look something like:
        td.text('View Error');
        var link = $('<a>').attr('href','//href value goes here');
        $('<img>').attr('src','///img src goes here').wrap(link).appendTo(td);
    }
    td.appendTo(tr);
    tbody.append(tr);
});