Formular Zusatzmodule Freiberufliche erstellt
This commit is contained in:
parent
8f8168dbeb
commit
7a9bcaaef8
4 changed files with 107 additions and 23 deletions
|
|
@ -1,5 +1,7 @@
|
|||
window.onload = function () {
|
||||
|
||||
const FORMDEBUG = false;
|
||||
|
||||
// initieiere Zeitmessung zur Botprevention
|
||||
var startTime = Date.now();
|
||||
|
||||
|
|
@ -10,43 +12,49 @@ window.onload = function () {
|
|||
userInteracted = true;
|
||||
}
|
||||
|
||||
// Eventlistener für Interaktionen - setzt userInteracted auf true bei Interaktion
|
||||
document.addEventListener("mousedown", setUserInteracted);
|
||||
document.addEventListener("touchstart", setUserInteracted);
|
||||
document.addEventListener("keydown", setUserInteracted);
|
||||
|
||||
document.getElementById('formular').addEventListener('submit', function (e) {
|
||||
e.preventDefault(); // Verhindert die Standard-Formularsendung
|
||||
|
||||
var honeyPot = document.getElementById("verify_email").value;
|
||||
e.preventDefault();
|
||||
|
||||
const form = e.target;
|
||||
const data = new FormData(form);
|
||||
const notification = document.getElementById('notification');
|
||||
const btn = document.getElementById('bestellformular-btn');
|
||||
const zsrTooltip = document.getElementById('zsr-tooltip');
|
||||
|
||||
var endTime = Date.now();
|
||||
var timeSpent = (endTime - startTime) / 1000; // Zeit in Sekunden
|
||||
document.getElementById("age").value = timeSpent;
|
||||
|
||||
// Setze die Werte für die Botvalidierung zum Auswerten in PHP
|
||||
document.getElementById("age").value = timeSpent;
|
||||
document.getElementById("hobbies").value = userInteracted ? "true" : "false";
|
||||
|
||||
const form = e.target;
|
||||
// Validierung der ZSR-Nummer
|
||||
const zsrNummer = form.elements['zsr_nummer'].value;
|
||||
const isNumberOrBeantragt = /^\d+$|^beantragt$/i.test(zsrNummer);
|
||||
// TODO REGEX für ZSR-Nummer
|
||||
if (!isNumberOrBeantragt) {
|
||||
// Display error message for invalid zsr_nummer
|
||||
const tooltip = document.getElementById('tooltip');
|
||||
tooltip.className = 'input-tooltip';
|
||||
zsrTooltip.className = 'input-tooltip';
|
||||
// Scroll to the tooltip element
|
||||
tooltip.scrollIntoView({ behavior: "smooth", block: "center", inline: "nearest" });
|
||||
zsrTooltip.scrollIntoView({ behavior: "smooth", block: "center", inline: "nearest" });
|
||||
return;
|
||||
}
|
||||
|
||||
const data = new FormData(form);
|
||||
const notification = document.getElementById('notification');
|
||||
const btn = document.getElementById('bestellformular-btn');
|
||||
console.log("userInteracted: " + userInteracted);
|
||||
console.log("timeSpent: " + timeSpent);
|
||||
console.log("hobbies: " + document.getElementById("hobbies").value);
|
||||
console.log("age: " + document.getElementById("age").value);
|
||||
console.log("verify_email: " + honeyPot);
|
||||
if (FORMDEBUG) {
|
||||
console.log("userInteracted: " + userInteracted);
|
||||
console.log("timeSpent: " + timeSpent);
|
||||
console.log("hobbies: " + document.getElementById("hobbies").value);
|
||||
console.log("age: " + document.getElementById("age").value);
|
||||
console.log("verify_email(honeypot): " + document.getElementById("verify_email").value);
|
||||
}
|
||||
|
||||
// Formulardaten an den Server senden
|
||||
fetch(form.action, {
|
||||
method: 'POST',
|
||||
mode: 'cors',
|
||||
|
|
|
|||
|
|
@ -165,7 +165,6 @@ table .far {
|
|||
}
|
||||
|
||||
#formular label {
|
||||
display: block;
|
||||
margin-bottom: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
|
|
@ -173,8 +172,7 @@ table .far {
|
|||
}
|
||||
|
||||
#formular select,
|
||||
#formular input,
|
||||
#formular textarea {
|
||||
#formular input[type="text"], #formular input[type="email"], #formular input[type="number"], #formular input[type="tel"], #formular textarea {
|
||||
width: 100%;
|
||||
padding: 0.5rem 1rem;
|
||||
border: 1px solid #D1D5DB;
|
||||
|
|
@ -272,6 +270,8 @@ table .far {
|
|||
.fadeIn {
|
||||
@apply transition-opacity duration-1000 ease-in-out opacity-100;
|
||||
}
|
||||
|
||||
// Honeypot- und Validierungsfelder im Bestellformular
|
||||
#verify_email, #age, #hobbies {
|
||||
display:none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@ title = 'Freiberufliche'
|
|||
<div>
|
||||
<input type="verify_email" id="verify_email" name="verify_email" >
|
||||
</div>
|
||||
<div id="tooltip" class="" data-tooltip="Bitte geben Sie eine gültie ZSR-Nummer, oder 'beantragt' ein.">
|
||||
<div id="zsr-tooltip" data-tooltip="Bitte geben Sie eine gültie ZSR-Nummer, oder 'beantragt' ein.">
|
||||
<label for="zsr_nummer">ZSR Nummer</label>
|
||||
<input type="text" id="zsr_nummer" name="zsr_nummer" required >
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ title = 'Zusatzmodule Freiberufliche'
|
|||
{{% aligncenter %}}
|
||||
#### Bestellformular
|
||||
## VeruA ** Verwaltung und Abrechnung
|
||||
### Zsatzmodule für Freiberufliche
|
||||
### Zusatzmodule für Freiberufliche
|
||||
<br>
|
||||
|
||||
---
|
||||
|
|
@ -20,9 +20,85 @@ title = 'Zusatzmodule Freiberufliche'
|
|||
|
||||
{{% /aligncenter %}}
|
||||
|
||||
<form action="https://verua.dev-1.andreashnida.de/php/ajaxmail.php" method="POST" id="formular">
|
||||
<div id="formPartOne">
|
||||
<input type="hidden" name="formularart" value="Zusatzmodule Freiberufliche">
|
||||
<div>
|
||||
<label for="gender">Geschlecht</label>
|
||||
<select id="gender" name="gender" required >
|
||||
<option value="weiblich">Frau</option>
|
||||
<option value="männlich">Mann</option>
|
||||
<option value="divers">Divers</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label for="sprache">Sprache</label>
|
||||
<select id="sprache" name="sprache" required >
|
||||
<option value="deutsch">Deutsch</option>
|
||||
<option value="franzoesisch">Französisch</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label for="name">Nachname</label>
|
||||
<input type="text" id="name" name="name" required >
|
||||
</div>
|
||||
<div>
|
||||
<label for="vorname">Vorname</label>
|
||||
<input type="text" id="vorname" name="vorname" required >
|
||||
</div>
|
||||
<div>
|
||||
<input type="text" id="hobbies" name="hobbies" >
|
||||
</div>
|
||||
<div>
|
||||
<label for="strasse">Strasse</label>
|
||||
<input type="text" id="strasse" name="strasse" required >
|
||||
</div>
|
||||
<div>
|
||||
<input type="text" id="age" name="age">
|
||||
</div>
|
||||
<div>
|
||||
<label for="plz_ort">PLZ Ort</label>
|
||||
<input type="text" id="plz_ort" name="plz_ort" required >
|
||||
</div>
|
||||
<div>
|
||||
<label for="telefon">Telefon</label>
|
||||
<input type="text" id="telefon" name="telefon" required >
|
||||
</div>
|
||||
<div>
|
||||
<label for="email">Email</label>
|
||||
<input type="email" id="email" name="email" required >
|
||||
</div>
|
||||
<div>
|
||||
<input type="verify_email" id="verify_email" name="verify_email" >
|
||||
</div>
|
||||
<div id="zsr-tooltip" data-tooltip="Bitte geben Sie eine gültie ZSR-Nummer, oder 'beantragt' ein.">
|
||||
<label for="zsr_nummer">ZSR Nummer</label>
|
||||
<input type="text" id="zsr_nummer" name="zsr_nummer" required >
|
||||
</div>
|
||||
<div>
|
||||
<label for="checkbox-group">Welche Erweiterungen möchten Sie hinzubuchen?</label>
|
||||
<div id="checkbox-group">
|
||||
<input type="checkbox" id="zusatzmodul-pop2" name="zusatzmodul-pop2" value="Zusatzmodul POP2">
|
||||
<label for="zusatzmodul-pop2">Zusatzmodul POP2 für 480 CHF</label>
|
||||
<br>
|
||||
<input type="checkbox" id="zusatzmodul-materialverwaltung" name="zusatzmodul-materialverwaltung" value="Zusatzmodul Materialverwaltung">
|
||||
<label for="zusatzmodul-materialverwaltung">Zusatzmodul Materialverwaltung für 480 CHF</label>
|
||||
<br>
|
||||
<input type="checkbox" id="zusatzmodul-qr-code" name="zusatzmodul-qr-code" value="Zusatzmodul QR-Code">
|
||||
<label for="zusatzmodul-qr-code">Zusatzmodul QR-Code für 36.00 CHF jährlich, Ausschaltgebühr einmalig pro Instanz 50.00 CHF</label>
|
||||
<br>
|
||||
<input type="checkbox" id="zusatzmodul-perigon" name="zusatzmodul-perigon" value="Zusatzmodul Perigon">
|
||||
<label for="zusatzmodul-perigon">Zusatzmodul Perigon, Ausschaltgebühr einmalig 50.00 CHF</label>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="w-full flex justify-center">
|
||||
<button id="bestellformular-btn" type="submit" class="submitbutton text-white mx-auto submit-after-valid-captcha-bak">Kostenpflichtig bestellen</button>
|
||||
<div id="notification" class="bg-blue-500 text-white rounded invisible opacity-0 hidden">Notification</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue