# Customized form issues

**URL:** <https://community.hubspot.com/t/customized-form-issues/118997>\
**Category:** CMS Development\
**Tags:** forms\
**Created:** [October 23, 2024, 12:29pm UTC](https://community.hubspot.com/t/customized-form-issues/118997 "2024-10-23T12:29:54Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![PCorbucci](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/pcorbucci/32/62715_2.png) [@PCorbucci](https://community.hubspot.com/u/PCorbucci)\
**Post date:** [October 23, 2024, 12:29pm UTC](https://community.hubspot.com/t/customized-form-issues/118997/1 "2024-10-23T12:29:54Z")

</div>

Hi everyone

First of all, i’m not a dev, unfortunately…  
Here is the problem:

We needed to force our customers to use only capitals, numbers and NO spaces on a specific field.  
We customized the form to prevent people from posting random stuff on this field by adding a popup message…  
Problem is: when they click the OK on this popup, the form gets submitted…  
Here is the code we are using:

```lia-code-sample
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
 // Créer le formulaire HubSpot
 hbspt.forms.create({
 portalId: "6890729",
 formId: "ac539db6-0778-4698-b3a4-9a99260e279d",
 onFormReady: function($form) {
 // Sélectionner le champ du formulaire que vous souhaitez valider
 var inputField = $form.find('input[name="plaque_d_immatriculation"]'); // Remplacer par le bon attribut 'name' ou 'id'

 // Appliquer un écouteur sur l'événement 'input' pour forcer le respect du regex
 inputField.on('input', function() {
 // Utiliser la regex pour forcer la frappe
 var value = inputField.val();

 // Remplacer tout ce qui ne correspond pas à des lettres majuscules ou chiffres
 var sanitizedValue = value.replace(/[^A-Z0-9]/g, '').toUpperCase(); 

 // Mettre à jour la valeur du champ
 inputField.val(sanitizedValue);
 });
 },

 onFormSubmit: function($form) {
 // Appeler la fonction de validation au moment de la soumission
 const isValid = validateInput($form);

 // Retourner false si la validation échoue pour empêcher l'envoi
 if (!isValid) {
 return false;
 }

 // Autoriser la soumission si la validation est correcte
 return true;
 }
 });

 // Fonction de validation : uniquement lettres majuscules et chiffres
 function validateInput($form) {
 // Sélectionner l'élément du formulaire correspondant au champ que vous souhaitez valider
 var inputField = $form.find('input[name="plaque_d_immatriculation"]'); // Remplacer par le bon attribut 'name' ou 'id'

 // Récupérer la valeur de l'input
 var inputValue = inputField.val(); // Utilisation de jQuery pour la valeur dans un formulaire HubSpot

 // Expression régulière pour valider uniquement majuscules et chiffres
 var regex = /^[A-Z0-9]+$/;

 // Valider la valeur de l'input
 if (!regex.test(inputValue)) {
 // Afficher un message d'erreur si le format n'est pas correct
 alert("Veuillez entrer uniquement des lettres majuscules et/ou des chiffres, sans espaces ni caractères spéciaux.");
 return false; // Empêche la soumission du formulaire
 }

 return true; // Si la validation est correcte, autorise la soumission
 }
</script>

```

Can someone help?

---

<div class="post-metadata">

**Author:** ![Berangere](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/berangere/32/220784_2.png) [@Berangere](https://community.hubspot.com/u/Berangere)\
**Post date:** [October 23, 2024, 3:39pm UTC](https://community.hubspot.com/t/customized-form-issues/118997/2 "2024-10-23T15:39:08Z")

</div>

Bonjour Pierre @PCorbucci et bienvenue dans la Communauté !  
Nous sommes ravis de vous avoir ici !  
Great question, thanks for asking the Community!  
I’d love to put you in touch with some of our Top Experts on this matter: Hi @Jnix284, [@zach\_threadint](https://community.hubspot.com/t5/user/viewprofilepage/user-id/324811) and @Stephanie-OG do you have suggestions to help @PCorbucci, please?  
Thanks so much and have a lovely day!  
Best,  
Bérangère

---

<div class="post-metadata">

**Author:** ![GiantFocal](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/giantfocal/32/41969_2.png) [@GiantFocal](https://community.hubspot.com/u/GiantFocal)\
**Post date:** [October 29, 2024, 3:21am UTC](https://community.hubspot.com/t/customized-form-issues/118997/3 "2024-10-29T03:21:30Z")

</div>

Hi @PCorbucci,

Based on your codes, there is a “return true” after your IF condition. So, even if the condition is false, your JS returns true, which triggers the form submission.

 ![GiantFocal_1-1730171979503.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/3X/e/f/efcb226080b3d295472a5f6343ded8577d508869.jpeg)

You can place the return true statement within an “else” condition to ensure the form is submitted when the condition is false. Please take a look at the revised code below:

```lia-code-sample
onFormSubmit: function($form) {
 // Appeler la fonction de validation au moment de la soumission
 const isValid = validateInput($form);

 // Retourner false si la validation échoue pour empêcher l'envoi
 if (!isValid) {
 return false;
 } else {
 // Autoriser la soumission si la validation est correcte
 return true;
 }

 }
 });

 // Fonction de validation : uniquement lettres majuscules et chiffres
 function validateInput($form) {
 // Sélectionner l'élément du formulaire correspondant au champ que vous souhaitez valider
 var inputField = $form.find('input[name="plaque_d_immatriculation"]'); // Remplacer par le bon attribut 'name' ou 'id'

 // Récupérer la valeur de l'input
 var inputValue = inputField.val(); // Utilisation de jQuery pour la valeur dans un formulaire HubSpot

 // Expression régulière pour valider uniquement majuscules et chiffres
 var regex = /^[A-Z0-9]+$/;

 // Valider la valeur de l'input
 if (!regex.test(inputValue)) {
 // Afficher un message d'erreur si le format n'est pas correct
 alert("Veuillez entrer uniquement des lettres majuscules et/ou des chiffres, sans espaces ni caractères spéciaux.");
 return false; // Empêche la soumission du formulaire
 } else {
return true; // Si la validation est correcte, autorise la soumission
 }

 } 

```

---

<div class="post-metadata">

**Author:** ![PCorbucci](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/pcorbucci/32/62715_2.png) [@PCorbucci](https://community.hubspot.com/u/PCorbucci)\
**Post date:** [October 29, 2024, 8:18am UTC](https://community.hubspot.com/t/customized-form-issues/118997/4 "2024-10-29T08:18:52Z")

</div>

Hi Abramam and thank you so much for your update. It helps me understand the way the script works. That’s very useful.  
however, as i implemented the revised code into my script, replacing the OnFormSubmit part by the one you kindly provided, i did not notice any change in the form behavior… I can type whatever i want in the field, the systems warns me when i click Submit, but when i click OK on the warning window, the form gets submitted 😞

I wish i was a developper ! 😄

---

<div class="post-metadata">

**Author:** ![Berangere](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/berangere/32/220784_2.png) [@Berangere](https://community.hubspot.com/u/Berangere)\
**Post date:** [November 8, 2024, 10:41am UTC](https://community.hubspot.com/t/customized-form-issues/118997/5 "2024-11-08T10:41:23Z")

</div>

Hi @PCorbucci and thanks @GiantFocal for the help!  
Your contribution is really appreciated!  
I’d be happy to check with @Bortami and [@zach\_threadint](https://community.hubspot.com/t5/user/viewprofilepage/user-id/324811): Hello, do you happen to have additional tips to share with @PCorbucci, please?  
Thanks a lot and have a great weekend!  
Best,  
Bérangère
