即使单击了JavaScript警报框的“取消”按钮，也会执行查询并发送电子邮件

Question

问候大家

我遇到了一个问题，即使我单击了警报框的“取消”按钮，也要更新数据库并发送电子邮件。警报框是使用JavaScript onclick事件生成的。该电子邮件是使用PHPMailer发送的。我很困惑这是PHP代码有问题还是JavaScript onclick事件有问题。如果是JavaScript onclick事件问题，那么我是否可以不对警报框使用任何JQuery或Bootstrap模式框？

这是我的PHP部分代码：

<?php
  //Condition when the submit button is clicked
  if(isset($_POST["btnSubmit"])){
    try 
    {
      $appointment_date = date('Y-m-d',strtotime($_POST['appointment_date']));

      // Inserting the data into database
      $smt = $db->prepare("INSERT INTO appointment (appointment_type, appointment_date, appointment_time, student_id, lecturer_id, field, venue, remarks, appointment_status)
                          VALUES (:appointment_type, :appointment_date, :appointment_time, :student_id, :lecturer_id, :field, :venue, :remarks, :appointment_status)");

      $smt->bindParam(':appointment_type',  $_POST["appointment_type"]);
      $smt->bindParam(':appointment_date', $appointment_date);
      $smt->bindParam(':appointment_time', $_POST["appointment_time"]);
      $smt->bindParam(':student_id', $_POST["student_id"]);
      $smt->bindParam(':lecturer_id', $_POST["lecturer_id"]);
      $smt->bindParam(':field', $_POST["field_id"]);
      $smt->bindParam(':venue', $_POST["venue"]);
      $smt->bindParam(':remarks', $_POST["remarks"]);
      $smt->bindParam(':appointment_status', $_POST["appointment_status"]);

      //PHPMailer set up 
      $stulec_link = "http://localhost/stulec/index.php";     
      $output="<strong>Greetings from STULEC,</strong> <br/>
              <p>There is an appointment request from " . $_POST['student_name'] . " who is currently studying in the " . $_POST['programme'] . " programme. </p>
              The appointment details are such as below: <br/>
                <ul>
                  <li>Appointment Type: ". $_POST['appointment_type'] ."</li>
                  <li>Appoinment Date: ". $_POST['appointment_date'] ."</li>
                  <li>Appointment Time: ". $_POST['appointment_time'] ."</li>
                  <li>Venue: ". $_POST['venue'] ." </li>
                  <li>Course Field: ". $_POST['field_name'] ." </li>
                  <li>Remarks: ". $_POST['remarks'] . "</li>
                </ul>
              </p>
              <p>Please approve the appointment request by logging in into <a href='".$stulec_link."'>STULEC</a>. Thank you.</p>";

      $mail = new PHPMailer;
      $mail->isSMTP();                                // Set mailer to use SMTP
      $mail->Host = 'smtp.gmail.com';             // Specify main and backup SMTP servers
      $mail->SMTPAuth = true;                   // Enable SMTP authentication
      $mail->Username = EMAIL;              // SMTP username
      $mail->Password = PASS;               // SMTP password
      $mail->SMTPSecure = 'tls';                    // Enable TLS encryption, `ssl` also accepted
      $mail->Port = 587;                        // TCP port to connect to

      $mail->setFrom('stulec@edu.my', 'STULEC');  //From sender
      $mail->addAddress( $_POST['lect_email'] , $_POST['lect_name']);  // Add a recipient
      $mail->isHTML(true);                    // Set email format to HTML

      $mail->Subject = 'STULEC | Appointment Request from Student';
      $mail->Body    =  $output;
      $mail->CharSet = 'utf-8';
      $mail->ContentType = 'text/html';                          

      if (($smt->execute()) && $mail->send())
      {
        echo "<script type= 'text/javascript'>alert('An appointment request has been sent to the lecturer. Please wait until the lecturer responds to your request.');";
        echo 'window.location= "student-view-pending-appointment.php"';
        echo "</script>";
      }                                          
      else
      {
        echo "<script type= 'text/javascript'>alert('Error: The appoinment cannot be made!');";
        echo 'window.location= "student-appointment-form.php"';
        echo "</script>";
      }
    }
    catch(PDOException $e)
    {
      echo $e->getMessage();
    }
  }

?>   

这是我在按钮部分的代码：

 <!--Submit button-->
                  <div class="box-footer">
                    <button type="submit" class="btn btn-success pull-right" name="btnSubmit" id="btnSubmit" onclick="checkConfirm()">Submit</button>
                  </div> 

这是我在JavaScript部分的代码：

<script language="JavaScript" type="text/javascript">
      //Script for confirmation
      function checkConfirm()
      {
          return confirm('Are you sure you want to make an appointment with this lecturer?');
      }
    </script>

请指导我如何解决此问题。谢谢。