单击提交按钮后，没有出现确认框（启动框）

Question

当前，创建一个PHP页面来更新数据。在单击“提交”按钮将数据更新到数据库之前，我先使用启动箱确认框。

问题是，当我单击按钮时，它将更新数据而不会弹出确认框。下面是我当前的代码。

php

  <form action="<?php echo htmlspecialchars(basename($_SERVER['REQUEST_URI'])); ?>" method="post">
          <table class='table table-bordered' align="center" width="100%">
            <thead>
              <tr>
                <th>Requester</th>
                <th>Date Booked</th>
                <th>Purpose</th>
                <th>Factory</th>
                <th>Room</th>
                <th>Start</th>
                <th>End</th>
                <th>Remark</th>
                <th>Status</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td><?php echo $Requested_by; ?></td>
                    <?php 
                        $booked = strtotime($Book_Date);
                        $Book_Date = date("d M Y -- g:i A", $booked);
                    ?>
                <td><?php echo $Book_Date; ?></td>
                <td><?php echo $Meeting_Description; ?></td>
                <td data-factory="<?php echo $Fac_ID; ?>"><?php echo $Fac_ID; ?></td>
                <td data-room="<?php echo $Room_Desc; ?>"><?php echo $Room_Desc; ?></td>
                    <?php 
                        $Start = strtotime($StartTime);
                        $StartTime = date("d M Y -- g:i A", $Start);
                    ?>
                <td><?php echo $StartTime; ?></td>
                    <?php 
                        $End = strtotime($EndTime);
                        $EndTime = date("d M Y -- g:i A", $End);
                    ?>
                <td><?php echo $EndTime; ?></td>
                <td><?php echo $Remark; ?></td>
                <td><?php echo $Book_Status; ?></td>
              </tr>
            </tbody>
          </table>
        </form>
      </div>
    </div><br>
    <div class="card-body double">
      <h4 class="card-title">Find Room</h4>
      <div class="form-group">
        <label for="exampleFormControlSelect1">Factory/Permises</label>
        <input type="text" class="form-control" value="<?php echo $Fac_ID; ?>" disabled>
      </div>
      <div class="form-group">
        <label for="exampleFormControlSelect2">Room No.</label>
        <input type="text" class="form-control" value="<?php echo $Room_Desc; ?>" disabled>
      </div>
      <div class="form-group">
        <label for="exampleFormControlSelect2">Date & Time.</label>
        <div class="main" >
          <div style="float:left; width: 160px;">
            <div id="nav"></div>
          </div>
          <div style="margin-left: 160px;">                    
            <div id="dp"></div>
          </div> 
        </div>
      </div>
  </div><br>
  <div class="card-body double">
      <h4 class="card-title">Action</h4>
        <form action="update_booking.php" method="POST"> 
          <div class="form-group">
            <label for="exampleFormControlSelect1">Status</label>
              <select class="form-control" id="exampleFormControlSelect1" name="Book_Status">
                <option value="Pending" <?php echo $Book_Status == 'Pending'? 'selected': '';?> >Pending</option>
                <option value="Reject" <?php echo $Book_Status == 'Reject'? 'selected': '';?> >Rejected</option>
                <option value="Approve" <?php echo $Book_Status == 'Approve'? 'selected': '';?> >Approved</option>
              </select>
          </div>
          <input type="hidden" name="Book_No" value="<?php echo $Book_No ?>">
          <div align="center">
          <button type="submit" class="btn btn-primary btn-block" onclick="submit()">Save</button>
          </div>
        </form>

使用启动箱的JavaScript

  <script>
    function submit() {
      bootbox.confirm({
        title: "<span style='color: white;'><b>Submit</b></span>",
        message: "Do you want to update this details?",
        buttons: {
            confirm: {
                label: 'Yes',
                className: 'btn btn-primary btn-sm'
            },
            cancel: {
                label: 'No',
                className: 'btn btn-danger btn-sm'
            }
        },
    callback: function (result) {
      if (result === true) {
            location.href = '../../dashboard/dashboard_admin.php';
        }else{

        }
    }
      });
  }
  </script>

有人可以帮助我吗？

Answer 1

好的，所以为打印警报编写代码仅用于检查目的

 <script>
        function submit() {
    alert(1);
          bootbox.confirm({
            title: "<span style='color: white;'><b>Submit</b></span>",
            message: "Do you want to update this details?",
            buttons: {
                confirm: {
                    label: 'Yes',
                    className: 'btn btn-primary btn-sm'
                },
                cancel: {
                    label: 'No',
                    className: 'btn btn-danger btn-sm'
                }
            },
        callback: function (result) {
          if (result === true) {
                location.href = '../../config/logout.php';
            }else{

            }
        }
          });
      }
      </script>

Answer 2

您可以尝试

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="bootstrap.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
      <script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/5.3.2/bootbox.js" crossorigin="anonymous"></script>
          <script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/5.3.2/bootbox.min.js" crossorigin="anonymous"></script>
              <script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/5.3.2/bootbox.min.js.map" crossorigin="anonymous"></script>




<form action="<?php echo htmlspecialchars(basename($_SERVER['REQUEST_URI'])); ?>" method="post">
          <table class='table table-bordered' align="center" width="100%">
            <thead>
              <tr>
                <th>Requester</th>
                <th>Date Booked</th>
                <th>Purpose</th>
                <th>Factory</th>
                <th>Room</th>
                <th>Start</th>
                <th>End</th>
                <th>Remark</th>
                <th>Status</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td><?php echo $Requested_by; ?></td>
                    <?php 
                        $booked = strtotime($Book_Date);
                        $Book_Date = date("d M Y -- g:i A", $booked);
                    ?>
                <td><?php echo $Book_Date; ?></td>
                <td><?php echo $Meeting_Description; ?></td>
                <td data-factory="<?php echo $Fac_ID; ?>"><?php echo $Fac_ID; ?></td>
                <td data-room="<?php echo $Room_Desc; ?>"><?php echo $Room_Desc; ?></td>
                    <?php 
                        $Start = strtotime($StartTime);
                        $StartTime = date("d M Y -- g:i A", $Start);
                    ?>
                <td><?php echo $StartTime; ?></td>
                    <?php 
                        $End = strtotime($EndTime);
                        $EndTime = date("d M Y -- g:i A", $End);
                    ?>
                <td><?php echo $EndTime; ?></td>
                <td><?php echo $Remark; ?></td>
                <td><?php echo $Book_Status; ?></td>
              </tr>
            </tbody>
          </table>
        </form>
      </div>
    </div><br>
    <div class="card-body double">
      <h4 class="card-title">Find Room</h4>
      <div class="form-group">
        <label for="exampleFormControlSelect1">Factory/Permises</label>
        <input type="text" class="form-control" value="<?php echo $Fac_ID; ?>" disabled>
      </div>
      <div class="form-group">
        <label for="exampleFormControlSelect2">Room No.</label>
        <input type="text" class="form-control" value="<?php echo $Room_Desc; ?>" disabled>
      </div>
      <div class="form-group">
        <label for="exampleFormControlSelect2">Date & Time.</label>
        <div class="main" >
          <div style="float:left; width: 160px;">
            <div id="nav"></div>
          </div>
          <div style="margin-left: 160px;">                    
            <div id="dp"></div>
          </div> 
        </div>
      </div>
  </div><br>
  <div class="card-body double">
      <h4 class="card-title">Action</h4>
        <form action="update_booking.php" method="POST"> 
          <div class="form-group">
            <label for="exampleFormControlSelect1">Status</label>
              <select class="form-control" id="exampleFormControlSelect1" name="Book_Status">
                <option value="Pending" <?php echo $Book_Status == 'Pending'? 'selected': '';?> >Pending</option>
                <option value="Reject" <?php echo $Book_Status == 'Reject'? 'selected': '';?> >Rejected</option>
                <option value="Approve" <?php echo $Book_Status == 'Approve'? 'selected': '';?> >Approved</option>
              </select>
          </div>
          <input type="hidden" name="Book_No" value="<?php echo $Book_No ?>">
          <div align="center">
          <button type="submit" class="btn btn-primary btn-block" onclick="submit()">Save</button>
          </div>
        </form>