https://www.mesves-sur-loire.fr/modules/api-websee-front/form-handler.js?20251202

1const FormHandler = {
2    init(containerSelector = '[id^="form-wrapper-"]') {
3        const containers = document.querySelectorAll(containerSelector);
4
5        containers.forEach(container => {
6            const button = container.querySelector('.form-submit-btn');
7            if (!button) return;
8
9            const id = button.dataset.id;
10            if (!id) return;
11
12            if (button.dataset.handlerAttached === "1") return;
13            button.dataset.handlerAttached = "1";
14
15            const markHuman = () => {
16                const dynamicField = container.querySelector('input[name^="interact_"]');
17                if (dynamicField) dynamicField.value = "1";
18            };
19            ['mousedown', 'focus'].forEach(evt =>
20                container.addEventListener(evt, markHuman, { once: true, capture: true })
21            );
22
23
24            button.addEventListener('click', () => {
25                const nom = container.querySelector(`#nom_${id}`)?.value.trim() || '';
26                const prenom = container.querySelector(`#prenom_${id}`)?.value.trim() || '';
27                const email = container.querySelector(`#email_${id}`)?.value.trim() || '';
28                const message = container.querySelector(`#message_${id}`)?.value.trim() || '';
29                const telephone = container.querySelector(`#tel_${id}`)?.value.trim() || '';
30                const adresse = container.querySelector(`#adresse_${id}`)?.value.trim() || '';
31                const adresse2 = container.querySelector(`#adresse2_${id}`)?.value.trim() || '';
32                const cp = container.querySelector(`#cp_${id}`)?.value.trim() || '';
33                const ville = container.querySelector(`#ville_${id}`)?.value.trim() || '';
34                const destinataire = container.querySelector(`#destinataire_${id}`)?.value.trim() || '';
35                const csrf_token = container.querySelector(`#csrf_token_${id}`)?.value || '';
36                const csrf_t = container.querySelector(`#csrf_t_${id}`)?.value || '';
37                const ref_id_num = container.querySelector(`#ref_id_num`)?.value || '';
38                const session_id = crypto.randomUUID();
39
40                if (!nom || !prenom || !email || !csrf_token || !csrf_t) {
41                    alert("Veuillez remplir tous les champs.");
42                    return;
43                }
44
45                if (!verifierChampsFormulaire(id)) {
46                    button.disabled = false;
47                    button.innerText = "Envoyer";
48                    return;
49                }
50
51                button.disabled = true;
52                button.innerText = "Envoi en cours merci de patienter...";
53
54
55
56
57                            const formData = new FormData();
58                            formData.append("id", id);
59                            formData.append("csrf_token", csrf_token);
60                            formData.append("csrf_t", csrf_t);
61                            formData.append("ref_id_num", ref_id_num);
62                            formData.append(`destinataire_${id}`, destinataire);
63                            formData.append(`nom_${id}`, nom);
64                            formData.append(`prenom_${id}`, prenom);
65                            formData.append(`email_${id}`, email);
66                            formData.append(`adresse_${id}`, adresse);
67                            formData.append(`adresse2_${id}`, adresse2);
68                            formData.append(`cp_${id}`, cp);
69                            formData.append(`ville_${id}`, ville);
70                            formData.append(`telephone_${id}`, telephone);
71                            formData.append(`message_${id}`, message);
72                            formData.append("session_id", session_id);
73                            const interactionField = container.querySelector('input[name^="interact_"]');
74                            if (interactionField) {
75                                formData.append(interactionField.name, interactionField.value);
76                            }
77
78                            console.log(formData);
79
80                            fetch("/modules/api-websee-front/form_submit.php", {
81                                method: "POST",
82                                body: formData
83                            })
84                                .then(r => r.text())
85                                .then(html => {
86                                    //container.innerHTML = html;
87                                    location.href = html;
88                                })
89                                .catch(() => {
90                                    alert("Erreur lors de l'envoi, merci d'essayer sur un autre navigateur.");
91                                    button.disabled = false;

92                                    button.innerText = "Envoyer";
93                                });
94
95            });
96        });
97    }
98};
99
100function verifierChampsFormulaire(id) {
101    const container = document.getElementById(`form-wrapper-${id}`);
102    if (!container) return false;
103
104    let erreurs = [];
105
106    const getValue = (name) => container.querySelector(`#${name}_${id}`)?.value.trim() || "";
107
108
109    const champs = {
110        nom: getValue('nom'),
111        prenom: getValue('prenom'),
112        email: getValue('email'),
113        message: getValue('message')
114    };
115
116    // Vérifications
117    if (!champs.nom) erreurs.push("Le nom est obligatoire.");
118    if (!champs.prenom) erreurs.push("Le prénom est obligatoire.");
119    if (!champs.email || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(champs.email)) {
120        erreurs.push("Adresse email invalide, exemple : [email protected].");
121    }
122    if (!champs.message) erreurs.push("Le message est obligatoire.");
123
124    // Affichage des erreurs
125    const oldAlert = container.querySelector('.form-erreur-block');
126    if (oldAlert) oldAlert.remove();
127
128    if (erreurs.length > 0) {
129        const blocErreur = document.createElement('div');
130        blocErreur.className = 'form-erreur-block';
131        blocErreur.style.cssText = 'border:1px solid red; padding:1em; background:#ffecec; color:#a00; margin-bottom:1em;';
132        blocErreur.innerHTML = `<strong>Veuillez corriger les erreurs suivantes :</strong><ul style="margin:0;padding-left:1.2em;">` +
133            erreurs.map(e => `<li>${e}</li>`).join('') +
134            `</ul>`;
135        container.prepend(blocErreur);
136        return false;
137    }
138
139    return true;
140}