From: Ammar Faizi <[email protected]>
To: Gilang Fachrezy <[email protected]>
Cc: Ammar Faizi <[email protected]>,
Taufiq Pohan <[email protected]>,
Aldy Prastyo <[email protected]>,
Muhammad Fitrah Pandjalu <[email protected]>,
Nauvalsa Yanandana <[email protected]>,
GNU/Weeb Mailing List <[email protected]>,
VNLX Kernel Department <[email protected]>
Subject: [PATCH v1 12/13] index: Integrate the sweetalert library with the form
Date: Mon, 28 Nov 2022 03:32:15 +0700 [thread overview]
Message-ID: <[email protected]> (raw)
In-Reply-To: <[email protected]>
Just for cosmetic.
Co-authored-by: Muhammad Fitrah Pandjalu <[email protected]>
Signed-off-by: Muhammad Fitrah Pandjalu <[email protected]>
Co-authored-by: Taufiq Pohan <[email protected]>
Signed-off-by: Taufiq Pohan <[email protected]>
Signed-off-by: Ammar Faizi <[email protected]>
---
public/index.php | 36 ++++++++++++++++++++++++------------
1 file changed, 24 insertions(+), 12 deletions(-)
diff --git a/public/index.php b/public/index.php
index abb016f..e07f750 100644
--- a/public/index.php
+++ b/public/index.php
@@ -4,6 +4,7 @@
<title>VNL Member Attendance Form</title>
<link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="assets/css/select2.min.css"/>
+ <link rel="stylesheet" type="text/css" href="assets/css/sweetalert2.min.css"/>
</head>
<body>
<div class="container p-5">
@@ -13,19 +14,19 @@
<form method="POST" action="javascript:void(0);" id="attendance_form">
<div class="mb-3">
<label for="full_name" class="form-label">Full Name <span class="text-danger">*</span></label>
- <input type="text" name="full_name" class="form-control" id="full_name"/>
+ <input type="text" name="full_name" class="form-control" id="full_name" required/>
</div>
<div class="mb-3">
<label for="city" class="form-label">City <span class="text-danger">*</span></label>
- <select id="city" name="city" class="form-control"></select>
+ <select id="city" name="city" class="form-control" required></select>
</div>
<div class="mb-3">
<label for="phone_number" class="form-label">Phone Number <span class="text-danger">*</span></label>
- <input type="text" name="phone_number" class="form-control" id="phone_number"/>
+ <input type="text" name="phone_number" class="form-control" id="phone_number" required/>
</div>
<div class="mb-3">
<label for="email" class="form-label">Email address <span class="text-danger">*</span></label>
- <input type="email" name="email" class="form-control" id="email"/>
+ <input type="email" name="email" class="form-control" id="email" required/>
</div>
<div class="border container p-3 border-3 border-dark rounded-3">
<h4>Social Media Accounts</h4>
@@ -54,6 +55,7 @@
<script type="text/javascript" src="assets/js/jquery-3.6.1.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/select2.full.min.js"></script>
+ <script type="text/javascript" src="assets/js/sweetalert2.all.min.js"></script>
<script type="text/javascript">
function load_select2_city(data)
{
@@ -68,14 +70,22 @@
success: load_select2_city
});
- function form_err(msg)
+ function form_err(msg, title = null)
{
- alert(msg);
+ Swal.fire({
+ title: (title ? title : "Invalid Input"),
+ text: msg,
+ icon: "error"
+ });
}
- function form_ok()
+ function form_ok(callback)
{
- alert("Terima kasih telah melakukan presensi, data Anda sudah dicatat dan dijamin aman!");
+ Swal.fire({
+ title: "Submission Success!",
+ text: "Thank you for your attendance, your data has been saved!",
+ icon: "success"
+ }).then(callback);
}
function validate_form(j)
@@ -134,6 +144,7 @@
json[key] = val;
}
+ console.log(json);
if (!validate_form(json))
return;
@@ -141,16 +152,17 @@
url: "api.php?action=submit_attendance",
data: JSON.stringify(json),
success: function () {
- form_ok();
- window.location = "";
+ form_ok(function () {
+ window.location = "";
+ });
},
error: function (res) {
let j = res.responseJSON;
if ("error" in j)
- form_err(j.error);
+ form_err(j.error, "Server Error");
else
- form_err("Unknown error!");
+ form_err("Unknown error!", "Server Error");
}
});
});
--
Ammar Faizi
next prev parent reply other threads:[~2022-11-27 20:33 UTC|newest]
Thread overview: 14+ messages / expand[flat|nested] mbox.gz Atom feed top
2022-11-27 20:32 [PATCH v1 00/13] App for member attendance record at Senayan Park, Jakarta Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 01/13] Initial index page Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 02/13] Add regions.json Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 03/13] index: Integrate city data with the form Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 04/13] index: Add social media accounts input Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 05/13] index: Add a red star to the required fields Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 06/13] index: city: Add "select the city" option on blank form Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 07/13] Export the DDL Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 08/13] Initial work on the database integration Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 09/13] Create initial API integration Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 10/13] Add input form validation Ammar Faizi
2022-11-27 20:32 ` [PATCH v1 11/13] assets: Add sweetalert library Ammar Faizi
2022-11-27 20:32 ` Ammar Faizi [this message]
2022-11-27 20:32 ` [PATCH v1 13/13] index: Make sure there is no duplicate submission in the same day Ammar Faizi
Reply instructions:
You may reply publicly to this message via plain-text email
using any one of the following methods:
* Save the following mbox file, import it into your mail client,
and reply-to-all from there: mbox
Avoid top-posting and favor interleaved quoting:
https://en.wikipedia.org/wiki/Posting_style#Interleaved_style
* Reply using the --to, --cc, and --in-reply-to
switches of git-send-email(1):
git send-email \
[email protected] \
[email protected] \
[email protected] \
[email protected] \
[email protected] \
[email protected] \
[email protected] \
[email protected] \
[email protected] \
/path/to/YOUR_REPLY
https://kernel.org/pub/software/scm/git/docs/git-send-email.html
* If your mail client supports setting the In-Reply-To header
via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line
before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox