93 lines
3.0 KiB
JavaScript
93 lines
3.0 KiB
JavaScript
/* 수지 AI·데이터 아카데미 Contact Form - lightweight AJAX submitter
|
|
* Expects the server endpoint to respond with plain text: "OK" on success, otherwise an error message.
|
|
*/
|
|
(function () {
|
|
"use strict";
|
|
|
|
function byId(id) { return document.getElementById(id); }
|
|
|
|
function show(el, visible) {
|
|
if (!el) return;
|
|
el.style.display = visible ? "block" : "none";
|
|
}
|
|
|
|
function setText(el, text) {
|
|
if (!el) return;
|
|
el.textContent = text || "";
|
|
}
|
|
|
|
function validateEmail(email) {
|
|
return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(String(email || "").trim());
|
|
}
|
|
|
|
function getFormMessage(form) {
|
|
var name = (form.querySelector('input[name="name"]') || {}).value || "";
|
|
if (name.trim().length < 2) return "이름을 입력해주세요.";
|
|
|
|
var email = (form.querySelector('input[name="email"]') || {}).value || "";
|
|
if (!validateEmail(email)) return "이메일을 올바르게 입력해주세요.";
|
|
|
|
var subject = (form.querySelector('input[name="subject"]') || {}).value || "";
|
|
if (subject.trim().length < 4) return "제목을 입력해주세요.";
|
|
|
|
var message = (form.querySelector('textarea[name="message"]') || {}).value || "";
|
|
if (message.trim().length < 10) return "내용을 조금 더 자세히 입력해주세요(10자 이상).";
|
|
|
|
return null;
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", function () {
|
|
var forms = document.querySelectorAll("form.contactForm");
|
|
if (!forms || !forms.length) return;
|
|
|
|
Array.prototype.forEach.call(forms, function (form) {
|
|
form.addEventListener("submit", function (e) {
|
|
e.preventDefault();
|
|
|
|
var sendmessage = byId("sendmessage");
|
|
var errormessage = byId("errormessage");
|
|
|
|
show(sendmessage, false);
|
|
show(errormessage, false);
|
|
setText(errormessage, "");
|
|
|
|
var validationMsg = getFormMessage(form);
|
|
if (validationMsg) {
|
|
setText(errormessage, validationMsg);
|
|
show(errormessage, true);
|
|
return;
|
|
}
|
|
|
|
var action = form.getAttribute("action") || "contactform/contactform.php";
|
|
|
|
var fd = new FormData(form);
|
|
|
|
fetch(action, {
|
|
method: "POST",
|
|
body: fd,
|
|
credentials: "same-origin"
|
|
})
|
|
.then(function (res) { return res.text(); })
|
|
.then(function (text) {
|
|
var t = (text || "").trim();
|
|
if (t === "OK") {
|
|
show(sendmessage, true);
|
|
setText(errormessage, "");
|
|
show(errormessage, false);
|
|
form.reset();
|
|
} else {
|
|
setText(errormessage, t || "메일 전송에 실패했습니다. 잠시 후 다시 시도해주세요.");
|
|
show(errormessage, true);
|
|
}
|
|
})
|
|
.catch(function () {
|
|
setText(errormessage, "메일 전송 중 오류가 발생했습니다. 네트워크/서버 상태를 확인해주세요.");
|
|
show(errormessage, true);
|
|
});
|
|
});
|
|
});
|
|
});
|
|
})();
|
|
|
|
|