Validate phone number before submit, point form /api/v1/contact

This commit is contained in:
Francesco Lorenzo D'Amico
2026-08-20 11:40:03 +02:00
parent a8f664a6ba
commit 10737b8272
+19 -8
View File
@@ -958,7 +958,7 @@
<input <input
type="text" type="text"
name="name" name="name"
placeholder="Dein Name*" placeholder="Name*"
required> required>
</div> </div>
</div> </div>
@@ -972,7 +972,7 @@
<input <input
type="email" type="email"
name="email" name="email"
placeholder="Deine E-Mail*" placeholder="E-Mail*"
required> required>
</div> </div>
</div> </div>
@@ -1013,7 +1013,7 @@
name="message" name="message"
cols="30" cols="30"
rows="10" rows="10"
placeholder="Deine Nachricht*" placeholder="Nachricht*"
required></textarea> required></textarea>
</div> </div>
</div> </div>
@@ -1082,27 +1082,38 @@
messageBox.style.display = "block"; messageBox.style.display = "block";
} }
function isValidPhone(value) {
if (!value) return true;
var digitCount = (value.match(/\d/g) || []).length;
return /^[0-9+\-\s()]+$/.test(value) && digitCount >= 7 && digitCount <= 15;
}
form.addEventListener("submit", function (event) { form.addEventListener("submit", function (event) {
event.preventDefault(); event.preventDefault();
submitButton.disabled = true;
var payload = { var payload = {
name: form.querySelector("[name=name]").value, name: form.querySelector("[name=name]").value,
email: form.querySelector("[name=email]").value, email: form.querySelector("[name=email]").value,
phone: form.querySelector("[name=phone]").value, phone: form.querySelector("[name=phone]").value.trim(),
subject: form.querySelector("[name=subject]").value, subject: form.querySelector("[name=subject]").value,
message: form.querySelector("[name=message]").value message: form.querySelector("[name=message]").value
}; };
fetch("/api/contact", { if (!isValidPhone(payload.phone)) {
showMessage("Bitte gib eine gültige Telefonnummer ein.", false);
return;
}
submitButton.disabled = true;
fetch("/api/v1/contact", {
method: "POST", method: "POST",
headers: { "Content-Type": "application/json" }, headers: { "Content-Type": "application/json" },
body: JSON.stringify(payload) body: JSON.stringify(payload)
}) })
.then(function (response) { .then(function (response) {
if (response.ok) { if (response.ok) {
showMessage("Danke für deine Nachricht! Ich melde mich so schnell wie möglich.", true); showMessage("Danke für die Nachricht! Ich melde mich so schnell wie möglich.", true);
form.reset(); form.reset();
} else { } else {
showMessage("Beim Senden ist ein Fehler aufgetreten. Bitte versuche es erneut.", false); showMessage("Beim Senden ist ein Fehler aufgetreten. Bitte versuche es erneut.", false);