Reputation: 47
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>
Upvotes: 1
Views: 2640
Reputation: 2009
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.
Upvotes: 1