Help with Dashboard HTML

HTML assistance. I'm hoping that I have a good start on it.

I'm trying to populate a table with rows of values from a database query. That is all great. I added code for the CSS Class .warning{ } and .alarm{ } to provide a means of COLOR Rows, alerting to values 5% to 8% being warning and over 8% alarm. I took the javascript from an example, but I believe my repeater and syntax to display values is goofed and I am not sure how to express the same item such that the javascript can actually calculate the values and work.

Dashboard template HTML below

    th {
        text-decoration: underline;
        font-size: 25px;
        font-weight: bold;

    .percent {
        text-align: center;
        font-size: 20px;
        font-weight: bold;

    .numeric {
        text-align: right;
        padding-right: 15px;
        font-size: 20px;
        font-weight: bold;

    .alpha {
        text-align: left;
        padding-left: 20px;
        font-size: 18px;
        font-weight: bold;

    .warning {
        background-color: yellow;

    .alarm {
        background-color: red;
<table cellpadding="1" border="1" id="table1" class="table-hover" style="width: 1200;">
            <th>% GD</th>
            <th>% MM</th>
            <th>% NR</th>

        <tr class="product-row"; ng-repeat="row in msg.payload">
            <td class=alpha bgcolor=white>{{row.ChScanner}}</td>
            <td class=numeric bgcolor=white>{{row.Total}}</td>
            <td class=numeric bgcolor=white>{{row.Good}}</td>
            <td class=percent bgcolor=white>{{row.PGD}}</td>
            <td class=numeric bgcolor=white>{{row.Mismatch}}</td>
            <td class=percent bgcolor=white>{{row.PMM}}</td>
            <td class=numeric bgcolor=white>{{row.NoRead}}</td>
            <td class=percent bgcolor=white>{{row.PNR}}</td>

    const rows = document.querySelectorAll(".product-row");
 for(let i = 0; i < rows.length; i++){
    const result = rows[i].querySelector(".PNR").textContent;
    if(result >= 5 && result < 8){ 
    else if(result >= 8 ){ 

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.