Validate phone number before submit, point form /api/v1/contact
This commit is contained in:
@@ -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);
|
||||||
|
|||||||
Reference in New Issue
Block a user