I want to create variables $eventDuration and $employeeRate, however, for some reason I am getting an error in the console saying they are undefined.
Here is my script code:
<script>
$(document).ready(function () {
$('.submitChange').click(function (ev) {
ev.stopPropagation();
var cell = ev.target;
$eventDuration = $(this).data('eventduration');
$employeeRate = $(this).data('employeerate');
$usertype = $(this).data('employeetype');
$cellId = $(cell).attr('id');
$eventId = $(cell).data('eventid');
$employeeId = $(cell).data('employeeid');
if ($cellId === 'green-cell') {
$action = 'remove';
} else {
$action = 'add';
}
$.ajax({
url: "includes/ajax_request.php",
method: "POST",
data: {
action: $action,
eventId: $eventId,
employeeId: $employeeId
},
success: function (response) {
if (response === 'removed') { // remove an employee
$(cell).removeAttr('id').attr('id', 'yellow-cell');
if($usertype === 'Server') { // remove server
$(".sum_servers").each(function(){
if($(this).attr('data-eventid')==$eventId){
$sumServer = parseInt($(this).text());
$sumServer--;
$(this).text($sumServer)
}
})
$(".sum_staff").each(function(){ // add staff member
if($(this).attr('data-eventid')==$eventId){
$sumStaff = parseInt($(this).text());
$sumStaff--;
$(this).text($sumStaff)
}
})
} else { // remove preparer
$(".sum_preparers").each(function(){
if($(this).attr('data-eventid')==$eventId){
$sumPreparers = parseInt($(this).text());
$sumPreparers--;
$(this).text($sumPreparers)
}
})
$(".sum_staff").each(function(){
if($(this).attr('data-eventid')==$eventId){
$sumStaff = parseInt($(this).text());
$sumStaff--;
$(this).text($sumStaff)
}
})
}
$(".sum_rate").each(function(){
if($(this).attr('data-eventid')==$eventId){
$sumRate = parseFloat($(this).text().replace('$', ''));
$sumRate = $sumRate - (eventDuration*employeeRate);
$(this).text($sumRate)
}
})
} else { // add an employee
$(cell).removeAttr('id').attr('id', 'green-cell');
if($usertype === 'Server') { // add server
$(".sum_servers").each(function(){
if($(this).attr('data-eventid')==$eventId){
$sumServer = parseInt($(this).text());
$sumServer++;
$(this).text($sumServer)
}
})
$(".sum_staff").each(function(){
if($(this).attr('data-eventid')==$eventId){
$sumStaff = parseInt($(this).text());
$sumStaff++;
$(this).text($sumStaff)
}
})
} else { // add preparer
$(".sum_preparers").each(function(){
if($(this).attr('data-eventid')==$eventId){
$sumPreparers = parseInt($(this).text());
$sumPreparers++;
$(this).text($sumPreparers)
}
})
$(".sum_staff").each(function(){
if($(this).attr('data-eventid')==$eventId){
$sumStaff = parseInt($(this).text());
$sumStaff++;
$(this).text($sumStaff)
}
})
}
}
}
})
})
});
</script>
Here is the cell data I am trying to access (class=”submitChange” at the bottom)
<tr>
<th scope='row'><?php echo $row['lastname'] . ", " . $row['firstname']; ?></th>
<td><?php echo $row['phone']; ?></td>
<td><?php echo $row['usertype']; ?></td>
<?php
foreach ($events_array as $event) {
$event_date = $event['date'];
$employee_id = $row['id'];
// Check if employee has a vacation day
$vacation_day = false;
foreach ($vacation_dates[$employee_id] as $vacation_date) {
if ($vacation_date == $event_date) {
$vacation_day = true;
break;
}
}
// Check if employee is working that day
$sql_check_worker = "SELECT * FROM Workers WHERE employee={$row['id']} AND event={$event['id']}";
$result_check_worker = $smeConn->query($sql_check_worker);
if ($result_check_worker->num_rows > 0) { // displays cell color if employee is working or not
$serverSum++;
$cellColorId = 'green-cell';
} else {
$cellColorId = 'yellow-cell';
}
?>
<?php if ($vacation_day) {
echo "<td class='vacation'></td>";
} else {
echo "<td class='submitChange' id='$cellColorId' data-employeerate='{$row['rate']}' data-eventduration='{$event['duration']}' data-employeetype='{$row['usertype']}' data-eventid='{$event['id']}' data-employeeid='{$row['id']}'></td>";
}
?>
<?php } ?>
<td><?php echo $serverSum; ?></td>
</tr>
The cell for total cost which I am attempting to update, if it’s relevant:
<!-- TOTAL COST FOR A COLUMN -->
<tr>
<th colspan="2">TOTAL COST</th>
<td class="black-cell">*BLACK*</td>
<?php
foreach ($events_array as $event) {
$event_id = $event['id'];
$sql_total_cost = "SELECT SUM(rate * duration) AS total_cost FROM Workers
INNER JOIN Employees ON Workers.employee = Employees.id
INNER JOIN Events ON Workers.event = Events.id
WHERE Workers.event = $event_id";
$result_total_cost = $smeConn->query($sql_total_cost);
$row_total_cost = $result_total_cost->fetch_assoc();
$total_cost = $row_total_cost['total_cost'];
?>
<td class='sum_rate' data-eventId='<?php echo $event_id;?>'><?php echo '$' . round($total_cost, 2); ?></td>
<?php } ?>
<td class="black-cell">*BLACK*</td>
</tr>
I am confused because I am able to create the $usertype variable the exact same way. But why am I unable to create $employeeRate or $eventDuration?