Question 42114 in PHP Question posted in
Official manual can be found here.

Color change of a button on condition based on value from my database – PHP

I made a web page for my project, where I need to change a button background color based on value from database.Like if the value below 10 then it will be green, 10~20 then yellow, 20++ then turns into red. Is it possible to do?

already the button works to fetch data from data base.enter image description here

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0 
                    <table class="center">
                    <?php
                        if(array_key_exists('test', $_POST)) 
                        {button();}
                        function button()
                        {
                            $conn = mysqli_connect('localhost','root','','asimdb');
                            $sql= "SELECT * FROM atmdata WHERE atm_id = 'ATM_01'";
                            $result = mysqli_query($conn,$sql);
                            While ($row =mysqli_fetch_assoc($result))
                        {
                        echo "
                        <tr><th>ATM ID</th> <td>".$row["atm_id"]."</td></tr>
                        <tr><th>ATM Name</th><td>".$row["ATM_Name"]."</td></tr>
                        <tr><th>ATM Location</th><td>".$row["ATM_Location"]."</td></tr>
                        <tr><th>Contact No.</th><td>".$row["Contact_No"]."</td></tr>
                        <tr><th>View CCTV</th><td>".$row["CCTV"]."</td></tr>
                        <tr><th>Current Temerature</th><td>N/A</td></tr>";
                        }
                        echo"</table>";
                        }
                        ?>

    <style>
                    .button {
                    border: none;
                    color: #2F4F4F;
                    padding: 12px 30px;
                    border-radius: 20px;
                    text-align: center;
                    display: inline-block;
                    font-size: 16px;
                    font-weight: bold;
                    margin: 5px 5px;
                    cursor: pointer;
                    transition: transform .2s;
                    box-shadow:
                    0 1px 2px rgba(0,0,0,0.07), 
                    0 2px 4px rgba(0,0,0,0.07), 
                    0 4px 8px rgba(0,0,0,0.07), 
                    0 8px 16px rgba(0,0,0,0.07),
                    0 16px 32px rgba(0,0,0,0.07), 
                    0 32px 64px rgba(0,0,0,0.07);}
                    .button:hover {
                    transform: scale(1.1);
                    border: 1px solid black}
      </style>
      <form method="post">
                <input type="submit"class= "button" name="test" value="ATM 01">
</form>

  2. 0

    You don’t give enough information. Maybe, you can create a color column in your sql table, then with jinja or other you can do somethings like this:

    Jinja:

    <div style="background-color:{{ data['color_ref'] }};">Hello World</div>

    PHP:

    <div style="background-color:<?=$color_ref?>;">Hello World</div>

    Javascript:

        if (qtt <= 10) {
        result = document.getElementById("happyday")
        result.style.backgroundColor = red;
    }
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search