Validation formulaire
Résoluameb2908 Messages postés 92 Date d'inscription jeudi 17 mars 2022 Statut Membre Dernière intervention 27 janvier 2025 - 14 nov. 2024 à 09:31
- Validation formulaire
- Formulaire de réclamation facebook - Guide
- Impossible d'utiliser ce numéro de téléphone pour la validation - Forum Gmail
- Récupérer compte hotmail sans formulaire - Forum Hotmail / Outlook.com
- Excel validation des données liste - Guide
- Formulaire de reclamation instagram - Guide
4 réponses
6 nov. 2024 à 16:43
bonjour
ça ne marche pas.... c'est à dire ?
as-tu des erreurs dans la console de ton navigateur ? sinon, peux-tu expliquer en détail en quoi cela ne fonctionne pas ?
6 nov. 2024 à 17:31
J'ai les messages d'erreurs du champ username et pas d'userpass
6 nov. 2024 à 17:59
Dans quel cas ?
Car tu fais des return dans ton code.. et donc tu ne passes pas à la suite... Donc si tu as une erreur dans le username... tu ne verras pas l'erreur dans le userpass...
Perso, pour éviter des répétitions dans ton code, je ferai un truc du genre
function setError(elem,message){ elem.classList.remove('bordure-verte'); elem.classList.add('bordure-rouge'); iconelem.innerHTML = '<i class="fa-solid fa-exclamation fa-2xs" style="color: #8b0000;"></i>'; form.elem.focus(); errorelem.innerText = message; errorelem.classList.add('erreur-message'); } function setValid(elem){ elem.classList.remove('bordure-rouge'); elem.classList.add('bordure-verte'); iconelem.innerHTML = '<i class="fa-solid fa-check fa-2xs" style="color: #63E6BE;"></i>'; errorelem.innerText = ''; errorelem.classList.remove('erreur-message'); event.preventDefault(); } function testUserName(){ let username = document.getElementById('username'); console.log('TEST DU USERNAME'); if(!username.value.trim()) { setError(username,'Username ne peut être vide !'); return false; } else if(!regexMail.test(username.value)) { setError(username,'Indiquez une adresse mail valide !'); return false; } else { setValid(username): return true; } } function testUserPass(){ let regexMail = /^[a-z0-9._-]+@[a-z]+\.[a-z]{2,4}$/; let regexMin = /[a-z]/; let regexMaj = /[A-Z]/; let regexChi = /[0-9]/; let regexSpe = /,;:!&#"@/; let userpass = document.getElementById('userpass'); console.log('TEST DU USERPASS'); if(!userpass.value.trim()) { setError(userpass,'Userpass ne peut être vide !'); return false; } else if(!regexMin.test(userpass.value)) { setError(userpass,'Userpass doît contenir des minuscules !'); return false; } else if(!regexMaj.test(userpass.value)) { setError(userpass,'Userpass doît contenir des majuscules !'); return false; } else if(!regexChi.test(userpass.value)) { setError(userpass,'Userpass doît contenir des chiffres !'); return false; } else if(!regexSpe.test(userpass.value)) { setError(userpass,'Userpass doît contenir des caractères spéciaux ,;:!&#"@'); return false; } else { setValid(userpass): return true; } } (function() { var createMembre = { init: function() { window.addEventListener('load', function(event) { var form = document.getElementById('create-membre'); var errorUsername = document.getElementById('error-username'); var errorUserpass = document.getElementById('error-userpass'); var iconUsername = document.getElementById('icon-username'); var iconUserpass = document.getElementById('icon-userpass'); form.addEventListener('submit', function(event) { let form = event.target; console.debug('submit'); let valid1 = true; let valid2 = true; valid1 = testUserName(); valid2 = testUserPass(); if(valid1 == false || valid2 == false ){ console.log('valid1',valid1,'valid2',valid2); event.preventDefault(); return; } }); }); } }; createMembre.init(); })();
8 nov. 2024 à 18:30
(function() { var createMembre = { init: function() { window.addEventListener('load', function(event) { function setError(element, iconElement, errorElement, message) { element.classList.remove('bordure-verte'); element.classList.add('bordure-rouge'); iconElement.innerHTML = '<i class="fa-solid fa-exclamation fa-2xs" style="color: #8b0000;"></i>'; form.element.focus(); errorElement.innerText = message; errorElement.classList.add('erreur-message'); } function setValid(element, iconElement, errorElement) { element.classList.remove('bordure-rouge'); element.classList.add('bordure-verte'); iconElement.innerHTML = '<i class="fa-solid fa-check fa-2xs" style="color: #63E6BE;"></i>'; errorElement.innerText = ''; errorElement.classList.remove('erreur-message'); } function testUserName() { var username = document.getElementById('username'); var inputUsername = document.getElementsByTagName('input')[0]; var regexMail = /^[a-z0-9._-]+@[a-z]+\.[a-z]{2,4}$/; var iconUsername = document.getElementsByTagName('span')[0]; var errorUsername = document.getElementsByTagName('div')[1]; console.log('TEST DU USERNAME'); if(!username.value.trim()) { setError(inputUsername, iconUsername, errorUsername, 'Username ne peut être vide !'); return false; } else if(!regexMail.test(username.value)) { setError(inputUsername, iconUsername, errorUsername, 'Indiquez une adresse mail valide !'); return false; } else { setValid(inputUsername, iconUsername, errorUsername); return true; } } function testUserPass() { var userpass = document.getElementById('userpass'); var inputUserpass = document.getElementsByTagName('input')[1]; var regexMin = /[a-z]/; var regexMaj = /[A-Z]/; var regexChi = /[0-9]/; var regexSpe = /,;:!&#"@/; var iconUserpass = document.getElementsByTagName('span')[1]; var errorUserpass = document.getElementsByTagName('div')[3]; console.log('TEST DU USERPASS'); if(!userpass.value.trim()) { setError(inputUserpass, iconUserpass, errorUserpass, 'Userpass ne peut être vide !'); return false; } else if(!regexMin.test(userpass.value)) { setError(inputUserpass, iconUserpass, errorUserpass, 'Userpass doît contenir des minuscules !'); return false; } else if(!regexMaj.test(userpass.value)) { setError(inputUserpass, iconUserpass, errorUserpass, 'Userpass doît contenir des majuscules !'); return false; } else if(!regexChi.test(userpass.value)) { setError(inputUserpass, iconUserpass, errorUserpass, 'Userpass doît contenir des chiffres !'); return false; } else if(!regexSpe.test(userpass.value)) { setError(inputUserpass, iconUserpass, errorUserpass, 'Userpass doît contenir des caractères spéciaux ,;:!&#"@'); return false; } else { setValid(inputUserpass, iconUserpass, errorUserpass); return true; } } var form = document.getElementById('create-membre'); form.addEventListener('submit', function(event) { var form = event.target; console.debug('submit'); var validUsername = true; var validUserpass = true; validUsername = testUserName(); validUserpass = testUserPass(); if(validUsername === false || validUserpass === false) { console.log(validUsername, validUserpass); event.preventDefault(); return; } }); }); } }; createMembre.init(); })();
Bonsoir, ça ne fonctionne toujours pas.
11 nov. 2024 à 20:09
Je te repose encore une fois les mêmes questions :
ça ne marche pas.... c'est à dire ?
as-tu des erreurs dans la console de ton navigateur ? sinon, peux-tu expliquer en détail en quoi cela ne fonctionne pas ?
Fais nous une capture écran de ton navigateur avec la console ouverte !
Expliques nous aussi ce que tu rentres dans ton formulaire... et donnes nous en son code !
14 nov. 2024 à 09:31
Bonjour, finalement ça marche nickel, merci de votre aide & bonne journée