How to update the database using a checkbox in a table column? – Jquery ajax

You can try something like this if I understand your question correctly. That uses jQuery so you need to include the CDN script. That basically submits data via AJAX indicating the new filter options for the row checked or unchecked. It does that my posting an array as filter_op_post having index 0 = to true or false and index 1 equal to the id of the row in the database. You can process that in the filtercheck.php file, although I included a little snippet. Let me know if that works for you.

That AJAX response is in “data”, so you can return whatever you want and process that as needed.

POST:

filter_op_post[] […]
0 true
1 2

RESPONSE:

[“true”,”2″] e.g.

index.php page:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous">
</script>
<!-- Begin Page Content -->
<div class="container-fluid">
<!-- Page Heading -->
    <h1 class="h2 mb-2 text-gray-800">
        Filter SMS
    </h1>
<!-- DataTales Example -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h4 class="m-0 font-weight-bold text-primary">
                Filtered SMS Summary
            </h4>
        </div>
        <div class="card-body">
<?php
$Config = array(
    'DB_TYPE' => 'mysql',
    'DB_HOST' => '127.0.0.1',
    'DB_NAME' => 'alarmfilter',
    'DB_USER' => 'root',
    'DB_PASS' => 'root',
    'DB_PORT' => '3306',
    'DB_CHARSET' => 'utf8'
);
$options = array(PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_OBJ, PDO::ATTR_ERRMODE => PDO::ERRMODE_WARNING, PDO::ATTR_EMULATE_PREPARES => true );
try {
$database = new PDO($Config['DB_TYPE'] . ':host=' . $Config['DB_HOST'] . ';dbname=' . $Config['DB_NAME'] . ';port=' . $Config['DB_PORT'] . ';charset=' . $Config['DB_CHARSET'], $Config['DB_USER'], $Config['DB_PASS'], $options);
}

catch (PDOException $e) {

                // Echo custom message. Echo error code gives you some info.
                echo 'Database connection can not be estabilished. Please try again later.' . '<br>';
                echo 'Error code: ' . $e->getCode();

                // Stop application :(
                // No connection, reached limit connections etc. so no point to keep it running
                exit;
}

$query="SELECT* FROM filtersms ";
$parameters = [];
$stmt = $database->prepare($query);
$stmt->execute($parameters);
$result_set =  $stmt->fetchAll(PDO::FETCH_ASSOC);

?>
            <div class="table-responsive">
                <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                    <thead>
                        <tr>
                            <th>Vendor</th>
                            <th>Alarm</th>
                            <th>Filter Option</th>
                        </tr>
                    </thead>
                    <tfoot> 
                    <tr>
                        <th>Vendor</th>
                        <th>Alarm</th>
                        <th>Filter Option</th>
                    </tr>
                    </tfoot> 
                    <tbody>
<?php
            foreach ($result_set as $row)  {
           ?>
                        <tr>
                            <td><?php echo $row["vendor"];  ?>
                            </td>
                            <td><?php echo $row["alarm_name"];  ?>
                            </td>
                            <td> 
                            <form>
                                <div class="form-check">
<?php $checked = ($row["filter_op"] == "true")?"checked":""; ?>
                                    <input 
<?php echo $checked;  ?>
                                    type="checkbox" class="form-check-input filter_check" id ="filter_op_id
<?php echo $row["id"];  ?>
                                    "/> 
                                    <input type="hidden" name="filter_op_post[]" value="<?php echo $row[" filter_op"]; ?>
                                    "/> 
                                    <input type="hidden" name="filter_op_post[]" value="<?php echo $row[" id"]; ?>
                                    "/> <label class="form-check-label" for="filter_check">Filter Alarm</label> 
                                </div>
                            </form>
                            </td>
                        </tr>
<?php
              }
             ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<style> table, table tr, table td {
    border:black 1px solid;
    border-collapse: collapse;
</style>
<script>
    $(".filter_check").on("click", function(e) {

        $(this).next().val($(this).prop("checked"));
        formdata = $(this).closest("form").serialize();

            $.ajax({

                type: "POST",
                url: 'include/filtercheck.php',
                dataType: "json",
                data: formdata,
                beforeSend: function(e) {
                    // $("#spinner").css("display", "block");
                },
            })
            .done(function(data, textStatus, jqXHR) {
                alert(data);
            })
            .fail(function( jqXHR, textStatus, errorThrown) {
            })
            .always(function(jqXHR, textStatus) {
                $("#spinner").css("display", "none");
            });
    });
</script>

include/filtercheck.php page:

<?php

$rowid = $_POST['filter_op_post'][1];
$filter_op_value = $_POST['filter_op_post'][0];
echo json_encode($_POST['filter_op_post']);


?>