我遇到的问题是，当数据已保存在数据库中时，模式不显示。数据保存到数据库中，但成功时不显示模态。数据从表单传递到 AJAX。如果我没有在表单中输入任何内容，则会显示 modalEmpty。问题是它不显示 ModalSuccess。
这是新更新的 tambahnotisphp.php
新更新的 tambahnotisphp.php
<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
/*include('connection.php');
$conn=Connect();*/
try {
$conn = new PDO("mysql:host=localhost;dbname=mbjbnotis", "root", "");
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch (PDOException $e) {
echo "Connection failed: " . $e->getMessage();
exit;
}
$idPengguna = "DI200017";
$nomborFail = $_POST['nomborFail'];
$ulasan = nl2br($_POST['ulasan']);
$status1 = "BELUM SELESAI";
$tarikhNotisKeluar = $_POST['tarikhNotisKeluar'];
$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, :status1, :idPengguna)";
$stmt = $conn->prepare($query);
$stmt->bindParam(':nomborFail', $nomborFail);
$stmt->bindParam(':ulasan', $ulasan);
$stmt->bindParam(':tarikhNotisKeluar', $tarikhNotisKeluar);
$stmt->bindParam(':futureDate30Days', $futureDate30Days);
$stmt->bindParam(':futureDate60Days', $futureDate60Days);
$stmt->bindParam(':status1', $status1);
$stmt->bindParam(':idPengguna', $idPengguna);
if ($stmt->execute()) {
echo "success";
} else {
echo "error";
}
$conn = null; // Close the database connection
}
?>
这里我包含了 tambahnotis.php 页面中的所有代码
来自 tambahnotis.php 的所有代码
<?php
session_start();
if(!isset($_SESSION['idPengguna']) && !isset($_SESSION['namaPengguna'])){
header("location: index.php");
}
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
<meta http-equiv="X-UA-Compatible" content="ie=edge"/>
<title>Sistem Notis MBJB</title>
<!-- CSS files -->
<link href="./dist/css/tabler.min.css?1684106062" rel="stylesheet"/>
<link href="./dist/css/tabler-flags.min.css?1684106062" rel="stylesheet"/>
<link href="./dist/css/tabler-payments.min.css?1684106062" rel="stylesheet"/>
<link href="./dist/css/tabler-vendors.min.css?1684106062" rel="stylesheet"/>
<link href="./dist/css/demo.min.css?1684106062" rel="stylesheet"/>
<style>
@import url('https://rsms.me/inter/inter.css');
:root {
--tblr-font-sans-serif: 'Inter Var', -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI, Roboto, Helvetica Neue, sans-serif;
}
body {
font-feature-settings: "cv03", "cv04", "cv11";
}
</style>
<!--<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>-->
<script src="jquery3.7.1.js"></script>
<!--<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>-->
</head>
<script>
function checkUsername(nomborFail){
//var usernameRegex = /^[a-zA-Z0-9]+$/;
//if(usernameRegex.test(nomborFail)){
document.getElementById('uname_response').innerHTML ="";
if(nomborFail.length > 4){
// AJAX request
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "ajaxfile.php", true);
xhttp.setRequestHeader("Content-Type", "application/json");
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// Response
var response = this.responseText;
document.getElementById('uname_response').innerHTML = response;
}
};
var data = {nomborFail: nomborFail};
xhttp.send(JSON.stringify(data));
}
//}else{
//document.getElementById('uname_response').innerHTML = "<span style='color: red;'>Sila isikan nombor fail.</span>";
//}
}
</script>
<body>
<!--<script src="./dist/js/demo-theme.min.js?1684106062"></script>-->
<div class="page">
<!-- Navbar -->
<header class="navbar navbar-expand-md d-print-none" >
<div class="container-xl">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-menu" aria-controls="navbar-menu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3">
<a href="./aHome.php">
<img src="./logo/logo.png" width="110" height="32" alt="MBJB" class="navbar-brand-image">
</a>
</h1>
<div class="navbar-nav flex-row order-md-last">
<div class="nav-item dropdown">
<a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown" aria-label="Open user menu">
<span class="avatar avatar-sm">
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" /><path d="M12 10m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" /><path d="M6.168 18.849a4 4 0 0 1 3.832 -2.849h4a4 4 0 0 1 3.834 2.855" /></svg>
</span>
<div class="d-none d-xl-block ps-2">
<div><?php echo $_SESSION['namaPengguna']; ?></div>
<div class="mt-1 small text-muted"><?php echo $_SESSION['aksesPengguna']; ?></div>
</div>
</a>
<div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
<a href="./profil.php" class="dropdown-item">Profil</a>
<div class="dropdown-divider"></div>
<a href="./logout.php" class="dropdown-item">Log Keluar</a>
</div>
</div>
</div>
</div>
</header>
<header class="navbar-expand-md">
<div class="collapse navbar-collapse" id="navbar-menu">
<div class="navbar">
<div class="container-xl">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="./aHome.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l-2 0l9 -9l9 9l-2 0" /><path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7" /><path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6" /></svg>
</span>
<span class="nav-link-title">
Laman Utama
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./tambahnotis.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Tambah Notis
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./semua.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Semua
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./hampir.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Hampir
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./notis1.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/checkbox -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Notis 1
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./notis2.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/checkbox -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Notis 2
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./notis3.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/checkbox -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Notis 3
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./notis4.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/checkbox -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Notis 4
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./notis5.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/checkbox -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Notis 5
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./selesai.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/checkbox -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 11l3 3l8 -8" /><path d="M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9" /></svg>
</span>
<span class="nav-link-title">
Selesai
</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./pengguna.php" >
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/ghost -->
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" /><path d="M12 10m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" /><path d="M6.168 18.849a4 4 0 0 1 3.832 -2.849h4a4 4 0 0 1 3.834 2.855" /></svg>
</span>
<span class="nav-link-title">
Pengguna
</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</header>
<div class="page-wrapper">
<!-- Page header -->
<div class="page-header d-print-none">
<div class="container-xl">
<div class="row g-2 align-items-center">
<div class="col">
<h2 class="page-title">
Borang Tambah Notis
</h2>
</div>
</div>
</div>
</div>
<!-- Page body -->
<div class="page-body">
<div class="container-xl">
<!-- Content here -->
<div class="row row-cards">
<div class="col-md-3 col-xl-3">
</div>
<div class="col-md-6 col-xl-6">
<div class="row row-cards">
<div class="col-12">
<form class="card">
<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" name="ulasan" id="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="tarikhNotisKeluar" required="">
</div>
<div class="card-footer">
<div class="row align-items-center">
<div class="col"></div>
<div class="col-auto">
<button class="btn btn-primary" id="btnTambahNotis" type="submit" name="submit">Tambah Notis</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="col-md-3 col-xl-3">
</div>
</div>
</div>
</div>
<footer class="footer footer-transparent d-print-none">
<div class="container-xl">
<div class="row text-center align-items-center flex-row-reverse">
<div class="col-lg-auto ms-lg-auto">
</div>
<div class="col-12 col-lg-auto mt-3 mt-lg-0">
<ul class="list-inline list-inline-dots mb-0">
<li class="list-inline-item">
Copyright © 2023
<a href="https://www.mbjb.gov.my/" class="link-secondary">MBJB</a>.
All rights reserved.
</li>
<li class="list-inline-item">
v1.0.0-beta19
</li>
</ul>
</div>
</div>
</div>
</footer>
</div>
</div>
<div class="modal modal-blur fade" id="modalSuccess" 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">Berjaya</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="modalError" 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">Tidak Berjaya</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>
<div class="modal modal-blur fade" id="modalEmpty" 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">Kosong</div>
<div>Isikan semua butiran</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="modalSimpanData" 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">Simpan Data?</div>
<div>Adakah anda ingin menyimpan data ini?</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-link link-secondary me-auto" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-green" id="simpanData">Simpan</button>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function() {
$("#btnTambahNotis").click(function() {
var nomborFail = $("#nomborFail").val();
var ulasan = $("#ulasan").val();
var tarikhNotisKeluar = $("#tarikhNotisKeluar").val();
// Check if the form fields are not empty
if (nomborFail.trim() === "" || ulasan.trim() === "" || tarikhNotisKeluar.trim() === "") {
// Display an error message or alert
$('#modalEmpty').modal('show');
return;
}
// Make an AJAX request to your server to delete data from the database
// Upon successful deletion, show a success modal
// Otherwise, show an error modal
$.ajax({
type: "POST",
url: "tambahnotisphp.php", // Replace with your server-side script URL
data: { nomborFail: nomborFail, ulasan: ulasan, tarikhNotisKeluar: tarikhNotisKeluar },
success: function(response) {
console.log("AJAX Request Successful");
console.log(response); // Add this line to log the response
if (response.trim() === "success") {
$('#modalSuccess').modal('show');
} else {
$('#modalError').modal('show');
}
},
error: function () {
console.log("AJAX Request Failed");
}
});
});
});
</script>
<!-- Libs JS -->
<!-- Tabler Core -->
<script src="./dist/js/tabler.min.js?1684106062" defer></script>
<!--<script src="./dist/js/demo.min.js?1684106062" defer></script>-->
</body>
</html>
尝试从
tamabahnotisphp.php