Validation JavaScript: tout ce que vous devez savoir sur la validation des formulaires et des e-mails



Cet article sur la validation JavaScript fournira des connaissances approfondies sur la validation de formulaire. Il fournira un exemple pour valider un formulaire en utilisant javascript.

JavaScript est l'un des langages les plus populaires , Développement Front-end et Back-end. Il est utilisé pour créer des sites Web magnifiquement conçus. En JavaScript, la validation est utilisée pour authentifier un utilisateur. Dans ce Validation JavaScript article, vous en apprendrez davantage sur la validation de formulaire dans l'ordre suivant:

Qu'est-ce que JavaScript?

est un haut niveau, interprété langage de programmation utilisé pour rendre les pages Web plus interactives. C'est un très puissant côté client langage de script quirend votre page Web plus vivante et interactive.





Javascript - Validation JavaScript - Edureka

C'est un langage de programmation qui vous aide à implémenter un complexe et beau design sur les pages Web . Si vous voulez que votre page Web ait l'air vivante et fasse bien plus que vous regarder, JavaScript est un must.



Caractéristiques de JavaScript:

  • C'est un langage de script et n'a rien à voir avec . Initialement, il a été nommé Moka , puis changé en LiveScript et finalement il a été nommé comme JavaScript .

  • JavaScript est un basé sur des objets langage de programmation qui prend également en charge le polymorphisme, l'encapsulation et l'héritage.



  • Vous pouvez exécuter JavaScript non seulement dans le navigateur mais aussi sur le serveur et tout appareil doté d'un moteur JavaScript.

Fonctions JavaScript

Les fondamentaux blocs de construction en JavaScript sont appelés comme Les fonctions . Il s'agit essentiellement d'un ensemble d'instructions qui effectue une tâche ou calcule une valeur. Pour utiliser une fonction, elle doit être définie quelque part dans la portée à partir de laquelle vous souhaitez l'appeler.

Une définition de fonction se compose du mot-clé function, suivi de:

  • La Nom de la fonction.

  • Une liste de paramètres à la fonction, entre parenthèses et séparés par des virgules.

  • Le JavaScript déclarations qui définissent la fonction, entre accolades, {}.

Prenons un exemple et voyons comment définir une fonction nommée ajouter :

function add (a, b) {return a + b}

Désormais, pour valider un utilisateur, une fonction de validation est utilisée. Alors allons de l'avant et apprenons-en plus sur la validation JavaScript.

Qu'est-ce que la validation?

La validation est une méthode pour authentifier l'utilisateur. JavaScript fournit la possibilité de valider le formulaire côté client afin que le traitement des données soit plus rapide que la validation côté serveur. Il est préféré par la plupart des développeurs Web. Grâce à JavaScript, nous pouvons valider le nom, le mot de passe, l'adresse e-mail, la date, les numéros de téléphone portable et d'autres champs.

Côté client la validation empêche le client de savoir si le formulaire est correct avant de recharger une page. Tandis que, Du côté serveur La validation est importante en raison du fait que la validation côté client peut être complètement contournée en désactivant JavaScript.

Passons maintenant à notre article sur la validation JavaScript et examinons l'exemple de la validation de formulaire.

Validation JavaScript: exemple

L'exemple suivant est un code en HTML, CSS et JavaScript pour valider un formulaire où:

  1. HTML est utilisé pour créer la forme.
  2. JavaScript est utilisé pour valider la forme.

FormValidation.html

validation du formulaire / ** /
Mot de passe:
 

Cela donnera la sortie suivante:

Maintenant, vous devez créer un autre fichier qui réorienter la page à une nouvelle après avoir cliqué soumettre bouton.

Text.html

Validation du formulaire / ** /

Il redirigera vers une autre page et donnera ce qui suit production :

Maintenant, nous devons ajouter un Fonction dans notre JavaScipt pour lier l'ID d'entrée. Cela fera apparaître un alerte message si l'un des champs est laissé vide.

function validateform () {var name = document.myform.name.value var password = document.myform.password.value if (name == null || name == '') {alert ('Le nom ne peut pas être vide' ) return false} else if (password.length<6){ alert('Password must be atleast 6 characters long.') return false } } 

Cela fera apparaître ce qui suit alerte quand le Champ de nom est laissé vide:

Ensuite, si vous entrez le nom et laissez le Champ de mot de passe vide, il apparaîtra ce qui suit alerte :

Une fois que vous avez ajouté le nom et le mot de passe au format correct, cette page sera redirigée vers la page Text.html pour le sortie finale.

final vs enfin vs finaliser

Le code complet pour Validation du formulaire est comme suit:

fonction de validation de formulaire validateform () {var name = document.myform.name.value var password = document.myform.password.value if (name == null || name == '') {alert ('Name cannot be blank ') return false} else if (password.length<6){ alert('Password must be atleast 6 characters long.') return false } } Mot de passe: 

C'était un exemple de validation de formulaire en JavaScript. nous pouvons également valider l'adresse e-mail, le mot de passe, le numéro de portable. et beaucoup plus.

Alors, prenons un autre exemple et voyons comment valider identifiant de messagerie en utilisant JavaScript.

Validation des e-mails JavaScript

Email.html

function ValidateEmail (inputText) {var mailformat = /^w+([.-ITED?w+)*@w+([.-ITED?w+)*(.w{2,3})+$/ if (inputText.value. match (mailformat)) {document.form1.text1.focus () return true} else {alert ('Vous avez entré une adresse e-mail invalide!') document.form1.text1.focus () return false}}

Production

Avec cela, nous sommes arrivés à la fin de notre article de validation JavaScript. J'espère que vous avez trouvé ce blog informatif et acquis une compréhension de base de la validation JavaScript.

N'oubliez pas non plus de consulter le par Edureka . Vous avez une question pour nous? Veuillez le mentionner dans la section commentaires de «Validation JavaScript» et nous vous répondrons.