Formatting Data To Be A Certain Color

So the output works perfect but what I need help on is when the SQL outputs the data and I would like the data to be a certain color based on states. This query will pull all the s

Solution 1:

There are a few improvements that you can make to this code.

• Always have use strict and use warnings in your code. And fix the problems they reveal (mostly declaring variables with my by the looks of it).
• You have use CGI /:standard/ which imports a load of CGI's functions into your namespace, but then you only call those functions as methods on your CGI object (in $q) so that import is unnecessary.
• You use indirect object notation (new CGI) to create your CGI object. This will work 99% of the time but in the rare cases when it breaks you will waste days tracking down the problem. Far better to use CGI->new instead.
• The HTML creation functions in CGI.pm (you use start_html()) have been deprecated for some time now. Please don't use them.
• Having raw HTML in your Perl code is likely to be a maintenance problem (as you seem to have discovered, given the errors in your HTML). I strongly recommend moving your HTML out of your Perl code and into templates. CGI::Alternatives has some suggestions on ways to do this.

Solution 2:

Just reuse the values as class names

<td class='cell100 column2 $STATE'>$STATE</td>

I have fixed a few illegal HTML elements too

.DOWN {
  color: blue
}

.PM {
  color: yellow
}

.MDS {
  color: red
}

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
<div id='page-wrapper'>
  <div class='row'>
    <div class='col-lg-12'>
      <h1>Critical Dashboard <small>Metrology</small></h1>

    </div>
  </div>
  <div class='row'>
    <div class='col-lg-12'>
      <div class='panel panel-primary'>
        <div class='panel-heading'>
          <h3 class='panel-title'><i class='fa fa-bar-chart-o'></i> Fab Dashboard - DMOS5 </h3>
        </div>
        <table class='table'>
          <thead>

            <tr>

              <th>MISTI</th>
              <th>STATE</th>
              <th>HRS</th>

            </tr>
          </thead>
          <tbody>
            <tr class='row100 body'>
              <td class='cell100 column1'>
                <form ACTION='http://d5lxgenwebapp01z.dal.make.ti.com/get_de1_de2_misti_comments.pl' METHOD='POST' target='_blank' NAME='userInput2'>
                  <INPUT TYPE='hidden' NAME='eq' MAXLENGTH='8' VALUE='$MISTI' />
                  <INPUT TYPE='hidden' NAME='pages' SIZE='3' MAXLENGTH='2' VALUE='50' />
                  <INPUT TYPE='submit' NAME='submit' VALUE='$MISTI' />
                </form>
              </td>
              <td class='cell100 column2 DOWN'>DOWN</td>
              <td class='cell100 column3'>$HRS</td>

            </tr>
            <tr class='row100 body'>
              <td class='cell100 column1'>
                <form ACTION='http://d5lxgenwebapp01z.dal.make.ti.com/get_de1_de2_misti_comments.pl' METHOD='POST' target='_blank' NAME='userInput2'>
                  <INPUT TYPE='hidden' NAME='eq' MAXLENGTH='8' VALUE='$MISTI' />
                  <INPUT TYPE='hidden' NAME='pages' SIZE='3' MAXLENGTH='2' VALUE='50' />
                  <INPUT TYPE='submit' NAME='submit' VALUE='$MISTI' />
                </form>
              </td>
              <td class='cell100 column2 PM'>PM</td>
              <td class='cell100 column3'>$HRS</td>

            </tr>
            <tr class='row100 body'>
              <td class='cell100 column1'>
                <form ACTION='http://d5lxgenwebapp01z.dal.make.ti.com/get_de1_de2_misti_comments.pl' METHOD='POST' target='_blank' NAME='userInput2'>
                  <INPUT TYPE='hidden' NAME='eq' MAXLENGTH='8' VALUE='$MISTI' />
                  <INPUT TYPE='hidden' NAME='pages' SIZE='3' MAXLENGTH='2' VALUE='50' />
                  <INPUT TYPE='submit' NAME='submit' VALUE='$MISTI' />
                </form>
              </td>
              <td class='cell100 column2 MDS'>MDS</td>
              <td class='cell100 column3'>$HRS</td>

            </tr>



          </tbody>
        </table>
      </div>
    </div>

  </div>
</div>