CSS up/down Status display on a table from input from a form

[danjesama]

Hi Guys, I have a table that shows information and the status of that, being on or off. the on and off part is hard to notice and as it is the most valuable I was hoping to change it from simple text of on/off to a green/red circle.

At the moment I am using a text input in a form for on/off. I have looked around and haven’t found much related to this.

I am going to replace the text input box with the something like a radio button or sprite images? and if its clicked it will show green and if not it will show red.

Any suggestions or ideas on this?

I have scoured the net for tutorials or something even similar with no luck.I will attach my code below: input form:

<th>Repo Status: * <td><input type="text" name="status" value="" /></td></tr> Displayed Table: echo '<td>' . $row['status'] .'</td>

Thanks in advance

[Paulie_D]

I’m not entirely clear on what it is you are trying to do and the code we have is a little basic (and PHP is of little value TBH) so a Codepen.io demo would be ideal. Even an image of the intended result would be helpful.

That said, unless the input (of whatever kind) shares a parent with your “indicator” (whatever that is), you can’t use CSS to change it’s style.

You’d need Javascript.

[Paulie_D]

What you could do is the old “hidden checkbox and label” trick

http://codepen.io/Paulie-D/pen/oZJdqW

[Author]

Posts