将数据插入数据库后如何加载模态作为警报？

Question

将数据插入数据库后弹出模式时遇到问题。因此，在 tambahnotis.php 中，我有一个表单供用户输入要插入数据库的数据。在 tambahnotis.php 的头部，我包含了从 tambahnotisphp.php 获取 sucsess == 'true' 的脚本

以下代码来自 tambahnotis.php

<script type="text/javascript">
    <?php
    if ($_GET['sucsess'] == 'true'){
        echo '$(document).ready(function() {
            $( "#modal-small" ).dialog();
        });';
    }
    ?>
</script>

<form class="card" action="tambahnotisphp.php" method="post" enctype="multipart/form-data" runat="server" >
    <div class="card-body">
        <div class="mb-3">
            <div class="form-label required">Nombor Fail</div>
            <input type="text" class="form-control" name="nomborFail" id="nomborFail" required="" onkeyup="checkUsername(this.value);">
            <div id="uname_response" ></div>
        </div>
        <div class="mb-3">
            <div class="form-label required">Ulasan</div>
            <textarea class="form-control" id="ulasan" name="ulasan" rows="4" cols="50" required=""></textarea>
        </div>
        <div class="mb-3">
            <div class="form-label required">Tarikh Notis Siasatan Dikeluarkan</div>
            <input type="date" class="form-control" name="tarikhNotisKeluar" id="tarikhNotis1" required=""/>
        </div>

        <div class="card-footer">
            <div class="row align-items-center">
            <div class="col"></div>
                <div class="col-auto">
                    <button type="submit" name="submit" class="btn btn-primary btnTambahNotis">Tambah Notis</button>
                </div>
            </div>
        </div>
    </div>
</form>


<div class="modal modal-blur fade" id="modal-small" tabindex="-1" role="dialog" aria-hidden="true">
      <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
        <div class="modal-content">
          <div class="modal-body">
            <div class="modal-title">Success</div>
            <div>Notis Siasatan berjaya ditambah</div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-success" data-bs-dismiss="modal">Okay</button>
          </div>
        </div>
      </div>
</div>


<div class="modal modal-blur fade" id="modal-small2" tabindex="-1" role="dialog" aria-hidden="true">
      <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
        <div class="modal-content">
          <div class="modal-body">
            <div class="modal-title">Error</div>
            <div>Notis Siasatan tidak berjaya ditambah</div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-success" data-bs-dismiss="modal">Okay</button>
          </div>
        </div>
      </div>
</div>

下面的代码是 tambahnotisphp.php，其中 php 代码用于将表单中的输入数据插入数据库。因此，在这段代码中，如果查询成功将数据插入数据库，我将传递 sucsess = 'true' 。

<?php

    include('connection.php');
    $conn=Connect();
    
    $idPengguna = "DI200017";

    $nomborFail = $conn->real_escape_string($_POST['nomborFail']);
    $ulasan = nl2br($_POST['ulasan']);
    $status = "BELUM SELESAI";
    // Date entered in the format "yyyy/mm/dd"
    $tarikhNotisKeluar = $conn->real_escape_string($_POST['tarikhNotisKeluar']);

    // Add 30 days to the date
    $futureDate30Days = date('Y-m-d',strtotime($tarikhNotisKeluar . ' +30 days'));
    $futureDate60Days = date('Y-m-d',strtotime($tarikhNotisKeluar . ' +60 days'));
    
        
    $query = "INSERT INTO notis(nomborFail, ulasan, tarikhNotisKeluar, tarikhNotis1, tarikhNotis2, status, idPengguna) VALUES('" . $nomborFail . "','" . $ulasan . "','" . $tarikhNotisKeluar . "','" . $futureDate30Days . "','" . $futureDate60Days . "','" . $status . "','" . $idPengguna . "')";

    $success = $conn->query($query);
            
    if ($success){
        
    header("Location: tambahnotis.php?sucsess=true");
            
    $conn->close();
    }else{
        die("Data Notis Siasatan tidak dapat ditambah: ".$conn->error);

    }   
    

?>

问题是它没有弹出模态框。

Answer 1

用这个代码替换您的代码！问题就会解决

<?php if (isset($_GET['success'])) { ?>
<script>
    var myModal = new bootstrap.Modal(document.getElementById('modal-small'), {
  keyboard: false
})
myModal.show()
</script>
<?php } ?>