I've a webpage that picks values from a database and populates a table for attendance. The radio buttons are created dynamically and assigned IDs from the database however, when I submit the entries, the database remains blank.
<?php
require __DIR__ . "/connection/connect.php";
?>
<!DOCTYPE html>
<html>
<head>
<title>Attendance</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="css/bootstrap-4.3.1.css">
</head>
<body>
<nav >
<div > <button type="button" data-toggle="collapse" data-target="#navbar8">
<p >
<i ></i> BRAND </p>
</button>
<div id="navbar8">
<ul >
<li > <a href="#">Home</a> </li>
<li > <a href="#">Reports</a> </li>
<li > <a href="#">About</a> </li>
</ul>
<p > <i aria-hidden="true"></i> <b> CLASS ATTENDANCE</b> </p>
<ul >
<li > <a href="#">
<i ></i>
</a> </li>
<li > <a href="#">
<i ></i>
</a> </li>
</ul>
</div>
</div>
</nav>
<form method="POST" action="submit.php">
<div >
<div >
<div >
<div >
<div >
<table >
<thead >
<tr>
<th>Name</th>
<th>Sex</th>
<th>Attendance</th>
</tr>
</thead>
<tbody>
<?php
$query = " SELECT * FROM `students` WHERE class = 'Year 7 -' ORDER BY stud_name ASC ";
if($result = $conn->query($query)){
while ($rows = $result->fetch_assoc()){
echo"
<tr>
<td>".$rows['stud_name']."</td>
<td>".$rows['gender']."</td>
<td><input type='radio' name=".$rows['stud_no']." value='present'> <label>Present</label> <input type='radio' name=".$rows['stud_no']." value='absent'> <label>Absent</label></td>
</tr>";
}
}
else{
echo "<div class='alert alert-danger' role='alert'> No records found </div>";
}
?>
</tbody>
</table>
</div>
</div>
</div>
<center><div >
<div ><button id="submit">Submit Attendance</button></div>
</div></center>
</div>
</div></form>
<div >
<div >
<div >
<div >
</div>
</div>
</div>
</div>
<script src="js/jquery-3.3.1.slim.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
<?php
if(isset($_POST['submit'])){
$stud_name = $_POST['stud_name'];
$stud_no = $_POST['stud_no'];
$insert = mysqli_query($conn,"INSERT INTO logs (`date`,`stud_name`,`status`) VALUES (now(),'$stud_name','$stud_no')");
}
?>
</html>
The resultant POST array looks like this:
Array
(
[student] => Array
(
[13KQC31001] => 1
[13KQC31006] => 0
[13KQC31007] => 1
[13KQC31009] => 1
[13KQC31010] => 1
[13KQC31011] => 0
[13KQC31012] => 1
[13KQC31015] => 1
[13KQC31016] => 0
[13KQC31017] => 1
)
)
After submitting the form, a simple query to illustrate success:
mysql> select * from logs;
---- --------------------- ------------ --------
| id | date | stud_no | status |
---- --------------------- ------------ --------
| 1 | 2022-08-16 08:58:46 | 13KQC31001 | 1 |
| 2 | 2022-08-16 08:58:46 | 13KQC31006 | 0 |
| 3 | 2022-08-16 08:58:46 | 13KQC31007 | 1 |
| 4 | 2022-08-16 08:58:46 | 13KQC31009 | 1 |
| 5 | 2022-08-16 08:58:46 | 13KQC31010 | 1 |
| 6 | 2022-08-16 08:58:46 | 13KQC31011 | 0 |
| 7 | 2022-08-16 08:58:46 | 13KQC31012 | 1 |
| 8 | 2022-08-16 08:58:47 | 13KQC31015 | 1 |
| 9 | 2022-08-16 08:58:47 | 13KQC31016 | 0 |
| 10 | 2022-08-16 08:58:47 | 13KQC31017 | 1 |
---- --------------------- ------------ --------
I hope this illustrates how you can easily use the student_ID or stud_no within the input element and then use that to update the database.
CodePudding user response：
You should use Jquery when click event and when you click Submit you use Ajax to request server and store.
Don't forget jquery CDN https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js
<form>
<div>
<p>name: Ex</p>
<input type='radio' data-student="ex" name="stud_no_1" value='present'> present
<input type='radio' data-student="ex" name="stud_no_1" value='absent'> absent
</div>
<hr>
<div>
<p>name: Bx</p>
<input type='radio' data-student="bx" name="stud_no_2" value='present'> present
<input type='radio' data-student="bx" name="stud_no_2" value='absent'> absent
</div>
<hr>
<button >Submit</button>
</form>
<script>
$(document).ready(function(){
$array = [];
$(".checkAttend").click(function() {
$stud_no = $(this).attr('name');
$stud_name = $(this).data('student');
$value = $(`input[name="${$stud_no}"]:checked`).val();
// Before push array, you check stud_name is exist ? update status : dont push array
$array.push({'stud_name': $stud_name, 'status': $value});
console.log($array);
result: [
0: {stud_name: 'ex', status: 'present'},
1: {stud_name: 'bx', status: 'absent'}
]
})
$(".submit").click(function() {
$.ajax({
url: "submit.php",
data: array,
success: function(data) {
console.log(data);
},
error: function(er) {
console.log(er);
});
})
});
<script>
CodePudding user response：
From what I see you are missing the attribute name="submit" from the submit button element
You should have
<button id="submit" name="submit">Submit Attendance</button>
In this way the condition:
if(isset($_POST['submit'])){
will be caught