Set Checkbox to CHECKED on Page Refresh based off of PHP Conditional

Question

Hopefully this isn't a duplicate, so please bear with me.

I have a form that is a series of checkboxes that sets a boolean value from 0 to 1 in a database, then on Submit, it takes those values, updates the database, then refreshes the page, so that if the value is set to 0 the checkbox is unchecked or if the value is 1, then the checkbox is checked. ALL OF THIS IS WORKING - THERE IS NO ISSUE WITH THIS PART OF MY CODE.

My issue is that above my SUBMIT button, I have a Select/Deselect All button that if ALL are selected, on page refresh, that the checkbox stays checked. But on refresh, the button is unchecked, and I have to click it twice to have the checkbox unselect all of the previously mentioned checkboxes.

Here is my code:

<form action="" method="post">
<?php
    while( $row = mysql_fetch_array($result) ){
        $id = $row['id'];
        $active = $row['active'];
        $name = $row['name'];
        $class = $row['class'];

        if($active == '1'){
            **IF ANY OF THESE CHECKBOXES ARE ACTIVE, THEN THE SELECT/DESELECT ALL BUTTON SHOULD BE CHECKED -- WHAT IS THE PROPER SYNTAX???**
        }


        echo "<input type='hidden' name='activate_".$id."' value='0'>";
        echo "<label class='switch'><input type='checkbox' class='checkbox' name='activate_".$id."' value='1'";

        if($active == '1'){
            echo "checked='checked'";

        }

        echo "/><div class='slider'></div><span>" . $name . "</span></label>";

    }

mysql_close();
?>
<label for="select_all" class="selectAllLabel"><input type="checkbox" id="select_all"/> Activate/Deactivate All</label>
<input type="submit" class="submit" name="submit" value="Update Active Roster">
</form>
 <iframe src="index.html" width="376" height="260" style="border: 0;"></iframe>

<?php

    if(isset($_POST['submit'])){

        require "config.php";

        $conn = new mysqli($db_host, $db_user, $db_pass, $db_name);
        if ($conn->connect_error) {
            die("Connection failed: " . $conn->connect_error);
        } 

        for ($i = 1; $i<count($_POST); $i++){
            $sql = "UPDATE roster SET active = ".$_POST["activate_$i"]." WHERE id = ".$i;
            if ($conn->query($sql) === TRUE) {
                echo "";
            } else {
                echo $conn->error;
            }
        }

        $conn->close();
        echo "<meta http-equiv='refresh' content='0'>";

    }

?>
<script>
$(document).ready(function(){
    //select all checkboxes
    $("#select_all").change(function(){  //"select all" change 
        var status = this.checked; // "select all" checked status
        $('.checkbox').each(function(){ //iterate all listed checkbox items
            this.checked = status; //change ".checkbox" checked status
        });
    });

    $('.checkbox').change(function(){ //".checkbox" change 
        //uncheck "select all", if one of the listed checkbox item is unchecked
        if(this.checked == false){ //if this item is unchecked
            $("#select_all")[0].checked = false; //change "select all" checked status to false
        }

        //check "select all" if all checkbox items are checked
        if ($('.checkbox:checked').length == $('.checkbox').length ){ 
            $("#select_all")[0].checked = true; //change "select all" checked status to true
        }
    });
});
</script>

You can see from my code EXACTLY where I would like the logic to trigger the Select/Deselect All value to be changed. I just don't know the proper syntax to do so.

Thank you in advance.

Answer 1

This is NOT best practice, by far, but it's working. I have flagged Fred -ii- answer as correct, so please go my his answer. If you want the quick and dirty version, this is what I came up with.

in my initial PHP block, I declared a variable $checked and set it to "" empty. In my WHILE Loop, I check ALL of the rows coming in and if ANY of them are active, then I set $checked to "checked" In my actual checkbox, I have a block of PHP that simply echos that variable. Here's the final code I have:

<?php
    $checked = "";

    while( $row = mysql_fetch_array($result) ){
        $id = $row['id'];
        $active = $row['active'];
        $name = $row['name'];
        $class = $row['class'];

        if($active == '1'){
            $checked = "checked";
        }


        echo "<input type='hidden' name='activate_".$id."' value='0'>";
        echo "<label class='switch'><input type='checkbox' class='checkbox' name='activate_".$id."' value='1'";

        if($active == '1'){
            echo "checked='checked'";
        }

        echo "/><div class='slider'></div><span>" . $name . "</span></label>";

    }

mysql_close();

?>
<label for="select_all" class="selectAllLabel"><input type="checkbox" id="select_all" <?php echo $checked; ?>/> Activate/Deactivate All</label>
<input type="submit" class="submit" name="submit" value="Update Active Roster">
</form>
 <iframe src="index.html" width="376" height="260" style="border: 0;"></iframe>

<?php

    if(isset($_POST['submit'])){

        require "config.php";

        $conn = new mysqli($db_host, $db_user, $db_pass, $db_name);
        if ($conn->connect_error) {
            die("Connection failed: " . $conn->connect_error);
        } 

        for ($i = 1; $i<count($_POST); $i++){
            $sql = "UPDATE roster SET active = ".$_POST["activate_$i"]." WHERE id = ".$i;
            if ($conn->query($sql) === TRUE) {
                echo "";
            } else {
                echo $conn->error;
            }
        }

        $conn->close();
        echo "<meta http-equiv='refresh' content='0'>";

    }

?>
<script>

Like I said at the beginning, this is a quick and dirty way of doing it, and a ternary operator is best practice.

Answer 2

"thank you @Fred-ii- can you post an answer so I can give you credit, please. – Murphy1976"

As per OP's request.

php => http://php.net/manual/en/language.operators.comparison.php under "Ternary..." ;-)

I.e. example from in there:

$action = (empty($_POST['action'])) ? 'default' : $_POST['action'];

You can replace that with isset() which should be used for checkboxes/radios.

In my personal experiences when fetching from a database and to have something checked/unchecked, using a ternary operator I found to be the best method.

It's a bit tricky but works wonders.

Additional references:

• https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Conditional_Operator
• https://en.wikipedia.org/wiki/Ternary_operation