For my thesis, I am working on a program for checking cars. Currently, I am working on the user management now I have encountered the problem that the database needs to be updated when a checkbox is changed status.
Now I have already started looking a bit on how to execute a PHP function when this happens, and I ended up with a JavaScript AJAX function
<script> function update () { $. ({ url:"includes/update_database.php", //the page containing php script type: "POST", //request type, dataType: 'json', data: { // STUCK }, }); } </script>
Now I have the problem that I do not know what to include with data because I have several checkboxes that are being shot by PHP. I don’t know exactly how to update my database. Do I have to run all over the table to detect changes?
Code from my table:
<div class="table-responsive"> <table class="table"> <thead class="thead-dark"> <tr> <th scope="col">Username</th> <th scope="col">E-mail</th> <th class="text-center" scope="col">Geactiveerd</th> <th class="text-center" scope="col">Admin</th> </tr> </thead> <tbody> <?php // Variablen $geactiveerd; // Items uit datbank halen uit de databank halen $query="SELECT ID, Username, Email, geactiveerd, admin FROM TBLgebruikers"; // Voert de query uit op de databank $result=mysqli_query($mysqli, $query); // Haalt het resultaat op en steekt het in een rij als een array // Gaat over heel de rijd zoeken -> while while($row=mysqli_fetch_array($result)) { // Echo eerste rij username/email --> Html echo ' <tr> <td>' . $row["Username"] .'</td> <td>'.$row["Email"] .'</td> '; // Haal uit de rijd geactiveerd(local variable) = geactiveerd(db) $geactiveerd=$row['geactiveerd']; $admin=$row['admin']; // Als geactiveerd == 0 en admin == 00 --> 0 = true if($geactiveerd==0 && $admin==0) { // 1- Echo geactiveerd -> checbbox aangevinkt // 2- Echo admin -> checbbox aangevinkt echo ' <td class="active" style="text-align: center"> <label class="switch" margin-bottom: -2px;> <input type="checkbox" name="geactiveerd" checked> <span class="slider round"></span> </label> </td> <td class="active" style="text-align: center"> <label class="switch" margin-bottom: -2px;> <input type="checkbox" name="admin" checked> <span class="slider round"></span> </label> </td> '; } // Als geactiveerd == 1 en admin == 0 --> 0 = true 1 = false elseif($geactiveerd==1 && $admin==0) { // 1- Echo geactiveerd -> checbbox niet aangevinkt // 2- Echo admin -> checbbox aangevinkt echo ' <td class="active" style="text-align: center"> <label class="switch" margin-bottom: -2px;> <input type="checkbox" name="geactiveerd"> <span class="slider round"></span> </label> </td> <td class="active" style="text-align: center"> <label class="switch" margin-bottom: -2px;> <input type="checkbox" name="admin" checked> <span class="slider round"></span> </label> </td> '; } // Als geactiveerd == 0 en admin == 1 --> 0 = true 1 = false elseif($geactiveerd==0 && $admin==1) { // 1- Echo geactiveerd -> checbbox geactiveerd // 2- Echo admin -> checbbox niet aangevinkt echo ' <td class="active" style="text-align: center"> <label class="switch" margin-bottom: -2px;> <input type="checkbox" name="geactiveerd" checked> <span class="slider round"></span> </label> </td> <td class="active" style="text-align: center"> <label class="switch" margin-bottom: -2px;> <input type="checkbox" name="admin"> <span class="slider round"></span> </label> </td> '; } else { // Anders echo admin en gactiveerd niet aangevinkt echo ' <td class="active" style="text-align: center"> <label class="switch" margin-bottom: -2px;> <input type="checkbox" name="geactiveerd"> <span class="slider round"></span> </label> </td> <td class="active" style="text-align: center"> <label class="switch" margin-bottom: -2px;> <input type="checkbox" name="admin"> <span class="slider round"></span> </label> </td> '; } echo '</tr>'; } ?> </tbody> </table> </div>
Advertisement
Answer
Listed for changes on the checkboxes. A simple way to do that is assign a class like ‘mycheckbox’ to each one so you can easily find them all. Once the page is loaded, add the change event trigger to the checkboxes.
$('.mycheckbox').change(function(e){ // Get row id or whatever you need to relate it to info in the DB rowid = $(e.target).attr('id'); isChecked = $(e.target).is(':checked'); data = {id: rowid, active: isChecked}; $.ajax({ url: 'myscript.php', method: 'POST', dataType: 'json', data: data }); });
Your php script would be something like this:
data = $_POST['data']; id = data['id']; isChecked = data['active']; // do your sql code stuff
This is a very basic example, and of course you’d want to sanitize or validate the data if you plan to insert any of it into the DB.