Jump to content

Changing the table cell color depending on input value


sandaru1sx

Recommended Posts

Hi,

 

Somehow I downloaded an example, modified and uploaded to server, also connected to mysql database.

Php properly is working here insertareg.php

Im new to PHP, just only know very little and earning by changing example codes.

 

Want to do this:

Only ( 0,1,2,3) will be inserted into Trays column and cells of the Trays column should

change according to the inserting values as this

 

o - red

1 - orange

2 - yellow

3 - green

 

With the color of the cell number also should be displayed in each cell of Trays column.

 

Help modifying the code

 

<html>
<head>
   <title>Data of Sensor</title>
</head>
<body>
<h1>Data from the temperature and moisture sensors</h1>
<form action="add.php" method="get">
<TABLE>
<tr>
   <td>P Line</td>
   <td><input type="text" name="temp1" size="20" maxlength="30"></td>
</tr>
<tr>
   <td>Trays</td>
   <td><input type="text" name="moi1" size="20" maxlength="30"></td>
</tr>
</TABLE>
<input type="submit" name="accion" value="Grabar">
</FORM>
<hr>
<?php
   include("conec.php");
   $link=Conection();
   $result=mysql_query("select * from tempmoi order by id desc",$link);
?>
<table border="1" cellspacing="1" cellpadding="1">
      <tr>
         <td> P Line  </td>
         <td> Trays  </td>
       </tr>
<?php      
   while($row = mysql_fetch_array($result)) {
printf("<tr><td>  %s </td><td>  %s  </td></tr>", $row["temp1"], $row["moi1"]);
   }
   mysql_free_result($result);
?>
</table>
</body>
</html>

 

 

Link to comment
Share on other sites

Hey,

 

inside your while loop, you need two switch statements to determine the colour. They will be pretty identical so I'll give you an example for you to change.

 

 

 
// get colour from value
switch($value) {
    case 0: // value goes after the case. so where I've put 0. You could even put words (make sure they're quoted).
        $colour = red;
        break; // after doing what you need to do in a case, always add a break. There are a few times where you won't, but you generally will.
    case 1:
        $colour = blue;
        break;
    default: // anything not covered above can be caught in the default
        $colour = black;
        break;
}

 

Hopefully this helps? If you need me to explain, just ask

Link to comment
Share on other sites

Thank you very much.

 

Don't have much programming skills. Please kindly explain where to put the switch statement exactly. 

<?php      
   while($row = mysql_fetch_array($result)) {
printf("<tr><td>  %s </td><td>  %s  </td></tr>", $row["temp1"], $row["moi1"]);
   }
   mysql_free_result($result);
?>

Do I have to edit the HTML tags?

Can you explain how to add colors inside HTML tags. Inside <td> tags.

Edited by sandaru1sx
Link to comment
Share on other sites

Set up a CSS style for each cell colour then set the class to be used in the switch statement

<?php

$cells = '';
for ($i=0; $i<8; $i++) {
    switch ($val = $i%4) {
        case 0: $cls = 'c0'; break;
        case 1: $cls = 'c1'; break;
        case 2: $cls = 'c2'; break;
        case 3: $cls = 'c3'; break;
    }
    $cells .= "<tr><td class='$cls'>$val</td></tr>\n";
}
?>

<html>
<head>
<title>Cell colours</title>
<style type="text/css">
table {
    border-collapse: collapse;
}
td {
    text-align: center;
    width: 150px;
}
td.c0 {
    background-color: red;
    color: white;
}
td.c1 {
    background-color: orange;
    color: white;
}
td.c2 {
    background-color: yellow;
    color: black;
}
td.c3 {
    background-color: green;
    color: white;
}
</style>
</head>
<body>
<table border="1" >
    <?php echo $cells ?>
</table>
</body>
</html>

post-3105-0-04021800-1389086045_thumb.png

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.