Reputation: 43
Here I have store the doctor schedule
in HTML table
with following JSON
format.
It successfully store like following in the database:
[{"monday_start":"09.00 A.M","monday_end":"10.00 A.M"},{"tuesday_start":"10.00 A.M","tuesday_end":"11.00 A.M"},{"wednesday_start":"Select Date","wednesday_end":"Select Date"},{"thursday_start":"Select Date","thursday_end":"Select Date"},{"friday_start":"Select Date","friday_end":"Select Date"},{"saturday_start":"Select Date","saturday_end":"Select Date"},{"sunday_start":"Select Date","sunday_end":"Select Date"}]
Here is the HTML code:
<table class="table table-striped mb-0">
<thead>
<tr>
<th>Days</th>
<th>Time (From)</th>
<th>Time (To)</th>
</tr>
</thead>
<tbody id="rows">
<tr>
<td>MonDay</td>
<td>
<div class="col-md-12">
<div class="form-group">
<select class="select" id="mon_start" name="mon_start">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div>
</td>
<td> <div class="col-md-12">
<div class="form-group">
<select class="select" id="mon_end" name="mon_end">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div>
</td>
</tr>
<tr>
<td>TuesDay</td>
<td>
<div class="col-md-12">
<div class="form-group">
<select class="select" id="tues_start" name="tues_start">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div>
</td>
<td>
<div class="col-md-12">
<div class="form-group">
<select class="select" id="tues_end" name="tues_end">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div>
</td>
</tr>
<tr>
<td>WednesDay</td>
<td>
<div class="col-md-12">
<div class="form-group">
<select class="select" id="wed_start" name="wed_start">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div>
</td>
<td>
<div class="col-md-12">
<div class="form-group">
<select class="select" id="wed_end" name="wed_end">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div>
</td>
</tr>
<tr>
<td>ThursDay</td>
<td><div class="col-md-12">
<div class="form-group">
<select class="select" id="thur_start" name="thur_start">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div></td>
<td><div class="col-md-12">
<div class="form-group">
<select class="select" id="thur_end" name="thur_end">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div></td>
</tr>
<tr>
<td>FriDay</td>
<td><div class="col-md-12">
<div class="form-group">
<select class="select" id="fri_start" name="fri_start">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div></td>
<td><div class="col-md-12">
<div class="form-group">
<select class="select" id="fri_end" name="fri_end">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div></td>
</tr>
<tr>
<td>SaturDay</td>
<td><div class="col-md-12">
<div class="form-group">
<select class="select" id="sat_start" name="sat_start">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div></td>
<td><div class="col-md-12">
<div class="form-group">
<select class="select" id="sat_end" name="sat_end">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div></td>
</tr>
<tr>
<td>SunDay</td>
<td><div class="col-md-12">
<div class="form-group">
<select class="select" id="sun_start" name="sun_start">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div></td>
<td><div class="col-md-12">
<div class="form-group">
<select class="select" id="sun_end" name="sun_end">
<option value="Select Date">Select</option>
<option value="09.00 A.M">09.00 A.M</option>
<option value="10.00 A.M">10.00 A.M</option>
<option value="11.00 A.M">11.00 A.M</option>
<option value="12.00 P.M">12.00 P.M</option>
<option value="Not Available">Not Available</option>
</select>
</div>
</div></td>
</tr>
</tbody>
</table>
Here is the Ajax call
to send data to addschedule.php
page:
<script>
// save comment to database
$(document).on('click', '#schedule', function () {
var modess = $('#rows tr').map(function() {
let $tr = $(this);
return [ {
"monday_start": $(this).find('#mon_start').val(),
"monday_end": $(this).find('#mon_end').val(),
"tuesday_start":$(this).find('#tues_start').val(),
"tuesday_end":$(this).find('#tues_end').val(),
"wednesday_start":$(this).find('#wed_start').val(),
"wednesday_end":$(this).find('#wed_end').val(),
"thursday_start": $(this).find('#thur_start').val(),
"thursday_end": $(this).find('#thur_end').val(),
"friday_start": $(this).find('#fri_start').val(),
"friday_end": $(this).find('#fri_end').val(),
"saturday_start": $(this).find('#sat_start').val(),
"saturday_end": $(this).find('#sat_end').val(),
"sunday_start": $(this).find('#sun_start').val(),
"sunday_end": $(this).find('#sun_end').val(),
} ]
console.log(modess);
});
var timetable = JSON.stringify( $.makeArray(modess) );
$.ajax({
url: "adminquery/addschedule.php", // Url to which the request is send
method: "POST", // Type of request to be send, called as method
data:{ index1: timetable,
},
cache: false,
success: function (response) {
$('#success_mes').fadeIn().html(response);
$("success_mes").fadeIn().html(response);
setTimeout(function () {
$('#success_mes').fadeOut("Slow");
}, 2000);
}
});
});
</script>
In my fetching page I coded like this to retrieve the data:
<table class="table table-hover mb-0">
<thead>
<tr>
<th>Day</th>
<th>Time (From)</th>
<th>Time (To)</th>
</tr>
</thead>
<tbody>
<?php
$stmt = $conn->prepare("SELECT * FROM schedule WHERE user_id=? ");
$stmt->bind_param("s", $_GET['userid']);
$stmt->execute();
$result = $stmt->get_result();
if($result->num_rows === 0) exit('No rows');
while($row = $result->fetch_assoc()) {
$times = json_decode($row['available_days'],true);
if (is_array($times) || is_object($times)) {
foreach($times as $key => $object) {
?>
<tr>
<td>Monday</td>
<td><?php echo $object['monday_start']; ?></td>
<td><?php echo $object['monday_end']; ?></td>
</tr>
<tr>
<td>tuesday</td>
<td><?php echo $object['tuesday_start']; ?></td>
<td><?php echo $object['tuesday_end']; ?></td>
</tr>
<tr>
<td>wednesday</td>
<td><?php echo $object['wednesday_start']; ?></td>
<td><?php echo $object['wednesday_end']; ?></td>
</tr>
<tr>
<td>thursday</td>
<td><?php echo $object['thursday_start']; ?></td>
<td><?php echo $object['thursday_end']; ?></td>
</tr>
<tr>
<td>friday</td>
<td><?php echo $object['friday_start']; ?></td>
<td><?php echo $object['friday_end']; ?></td>
</tr>
<tr>
<td>saturday</td>
<td><?php echo $object['saturday_start']; ?></td>
<td><?php echo $object['saturday_end']; ?></td>
</tr>
<tr>
<td>sunday</td>
<td><?php echo $object['sunday_start']; ?></td>
<td><?php echo $object['sunday_end']; ?></td>
</tr>
<?php } } }
?>
</tbody>
</table>
Only first row shows the value, others shows the error showing like this:
Notice: Undefined index: tuesday_start in C:\xampp\htdocs\Hospital\adminpanel\show_schedule.php on line 260Notice: Undefined index: tuesday_end in C:\xampp\htdocs\Hospital\adminpanel\show_schedule.php on line 261
for every following row.
Please help me.
Upvotes: 1
Views: 57
Reputation: 2438
The problem is here : foreach($times as $key => $object)
, you are looping over each day, but inside the loop you try to display the data for all days.
Here is a possible solution :
<?php
$days = array('monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday', 'sunday'); // define all days to be displayed
foreach($days as $day)
{
// retrieve current day data only
// this will return the item that has a DAY_start key in it
$dayData = array_values(array_filter($times, function($d) use($day){return array_key_exists($day . '_start', $d);}))[0] ;
?>
<tr>
<td><?php echo ucfirst($day); /* display the name of the day */?></td>
<td><?php echo $dayData[$day . '_start']; /* display the current day start */?></td>
<td><?php echo $dayData[$day . '_end']; /* display the current day end */?></td>
</tr>
<?php
}
?>
Upvotes: 1