Fix: Elements not loading due to typo

This commit is contained in:
2025-12-13 11:52:30 +01:00
parent 59732f35fb
commit 3c7dc625e7
7 changed files with 47 additions and 91 deletions

View File

@@ -105,15 +105,15 @@
// navfixed
// ##################
let scrolling = window.scrollY;
let naviagtion = document.querySelector(".naviagtion");
let navigation = document.querySelector(".navigation");
function navFixed() {
scrolling = window.scrollY;
if (scrolling > 10) {
naviagtion.classList.add('nav-bg');
navigation.classList.add('nav-bg');
} else {
naviagtion.classList.remove('nav-bg');
navigation.classList.remove('nav-bg');
}
};
@@ -161,35 +161,44 @@
function ready(fn){ if(document.readyState!=='loading'){fn()} else {document.addEventListener('DOMContentLoaded',fn)} }
ready(function(){
const form = document.getElementById('leadcapture-form');
if (!form) return; // veiligheid
const okEl = document.getElementById('leadcapture-status');
const errEl = document.getElementById('leadcapture-error');
const form = document.getElementById('leadcapture-form');
if (!form) return;
const okEl = document.getElementById('leadcapture-status');
const errEl = document.getElementById('leadcapture-error');
const endpoint = "https://crm.start-it.nl/api/v1/LeadCapture/231344ae2852d65f41e98d99da418af8";
const get = (name) => form.elements.namedItem(name);
form.addEventListener('submit', async function(e){
e.preventDefault();
// Laat native HTML5 validatie werken (required, email type, etc.)
if (!form.reportValidity()) return;
if (okEl) okEl.hidden = true;
if (errEl) errEl.hidden = true;
// Honeypot
if (form.company && form.company.value.trim() !== '') return;
if (((get('company')?.value) || '').trim() !== '') return;
// Kleine validatie
const email = (form.emailAddress?.value || '').trim();
const last = (form.lastName?.value || '').trim();
if (!email || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email) || !last) {
if (errEl) { errEl.hidden = false; errEl.textContent = "Controleer achternaam en e-mail."; }
// Extra JS-validatie (redundant maar handig)
const email = ((get('emailAddress')?.value) || '').trim();
const last = ((get('lastName')?.value) || '').trim();
const desc = ((get('description')?.value) || '').trim();
if (!email || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email) || !last || !desc) {
if (errEl) { errEl.hidden = false; errEl.textContent = "Controleer achternaam, e-mail en bericht."; }
return;
}
const payload = {
salutationName: form.salutationName?.value || null,
firstName: form.firstName?.value || null,
lastName: form.lastName?.value || null,
salutationName: (get('salutationName')?.value || null),
firstName: (get('firstName')?.value || null),
lastName: last || null,
emailAddress: email || null,
phoneNumber: form.phoneNumber?.value || null,
description: form.description?.value || null
phoneNumber: (get('phoneNumber')?.value || null),
description: desc || null
};
const submitBtn = form.querySelector('button[type="submit"]');
@@ -207,14 +216,14 @@
if (res.ok) {
form.reset();
if (okEl) okEl.hidden = false;
// // Optioneel: redirect
// window.location.href = "/bedankt/";
} else {
const text = await res.text().catch(() => '');
console.error('LeadCapture response:', res.status, text);
if (errEl) { errEl.hidden = false; errEl.textContent = "Serverfout ("+res.status+")."; }
}
} catch (e) {
} catch (err) {
console.error('LeadCapture error:', err);
if (errEl) { errEl.hidden = false; errEl.textContent = "Netwerk/CORS fout. Zie console."; }
console.error('LeadCapture error:', e);
} finally {
if (submitBtn) submitBtn.disabled = false;
}

View File

@@ -5,7 +5,7 @@
<div class="container my-4">
<div class="subscription-wrapper col-lg-10 align-items-center mx-auto">
<div class="d-flex position-relative mx-5 justify-content-between align-items-center flex-column flex-md-row text-md-left">
<h4 class="text-white flex-fill">{{ i18n "subscribe_newsletter" | safeHTML }}</h4>
<h3 class="text-white flex-fill">{{ i18n "subscribe_newsletter" | safeHTML }}</h3>
<form action="{{ .mailchimp_form_action }}" method="post"
name="mc-embedded-subscribe-form" target="_blank" novalidate class="row flex-fill">
<div class="col-lg-7 my-md-2 my-2">