Vous savez maintenant utiliser des variables Javascript.
Nous allons apprendre maintenant à Manipuler le contenu des ces variables en utilisant l'OBJET STRING du langage javascript.
Voici les PROPRIÉTÉS qui peuvent être utilisées avec l'OBJET STRING :
length
C'est un entier qui indique la longueur de la chaîne de caractères.
charAt()
Méthode qui permet d'accéder à un caractère isolé d'une chaîne.
indexOf()
Méthode qui renvoie la position d'une chaîne partielle à partir d'une position déterminée(en commençant au début de la chaîne pricipale soit en position 0).
lastIndexOf()
Méthode qui renvoie la position d'une chaîne partielle à partir d'une position déterminée
(en commençant à la fin soit en position length moins 1).
substring(x,y)
Méthode qui renvoie un string partiel situé entre l position x et la position y-1.
toLowerCase()
Transforme les lettres en minuscules.
toUpperCase()
Transforme toutes les lettres en Majuscules.
match()
Se comporte comme les méthodes indexOf et lastIndexOf, mais la méthode match retourne les caractéres spécifiés ou "null" au lieu d'une valeur numérique.
Cliquez ici afin d'obtenir plus d'informations concernant l'objet String.
Description
Ajoutez une page à votre portfolio en affichant les assistants HTML, JAVASCRIPT et FORMULAIRE en affichant la directive no 9138
Inscrivez dans le champ le titre : Javascript : Objet String
Sélectionnez la matière : informatique
Inscrivez dans le champ No de la directive : 9138
Insérer dans cette page en utilisant le bouton NOUVEAU le code HTML d'une page de base.
Inscrivez dans votre page (section BODY) le titre de niveau 1 : Javascript : Objet String
LA PROPRIÉTÉ LENGTH
Cette propriété est très utilisée pour vérifier si l'utilisateur a bien complété un champ de formulaire.
Voyons comment vérifier si un champ de formulaire a bien été rempli.
Insérez dans votre page un formulaire nommé f2 contenant un champ de type texte nommé t ainsi qu'une étiquette : "Courriel : "
<form name=f2>Courriel : <input type=text name=t /></form>
Ajoutez un bouton à ce formulaire qui lancera la fonction validestring()
<input type=button value=Valider onclick=javascript:validestring() />
Insérez en en-tête (HEAD) en utilisant le bouton JAVASCRIPT le code d'identification du langage Javascript.
Dans ce code, définissez la fonction validestring() en utilisant le bouton FONCTION
Dans cette fonction, insérer le code de la structure conditionnelle (SI) en utilisant le bouton SI
Entre les parenthèses de la structure if(), inscrivez le code qui vérifiera si le champ t contient une valeur.
document.f2.t.value.length==0
Explication : SI --> le la valeur du champ t du formulaire f2 a une longueur de 0 (donc vide)
Entre les accolades qui suivent, inscrivez le code de l'action qui sera effectuée dans le cas d'un champ non complété, c'est à dire : alert('Vous devez inscrire votre adresse de courriel dans le champ')
Maintenant, il faut vérifier la présence du @ et d'un . dans l'adresse.
Dans votre ligne de code suivante : if (document.f2.t.value.length==0), insérez l'opérateur logique OU (||) et ajouter deux autres vérifications en utilisant la propriété indexOf() de l'objet String.
Vous devriez obtenir la ligne suivante : if ((document.f2.t.value.length==0)||(document.f2.t.value.indexOf('@',0)==-1) || (document.f2.t.value.indexOf('.',0)==-1))
C'est à dire : si le champ t est vide OU le champ t ne contient pas le caractère @ OU le champ t ne contient pas le caractère .
Modifiez votre texte alert() suivant Vous devez inscrire votre courriel dans le champ de texte afin de lui ajouter ou l'adresse de courriel indiquée n'est pas valide.
N'oubliez pas de placer devant les apostrophes intérieurs le caractère \.
Vous devriez obtenir : alert('Vous devez inscrire votre adresse de courriel dans le champ de texte ou l\'adresse de courriel indiquée n\'est pas valide.')
Entre les accolades qui suivent le mot else, il faudrait inscrire document.f2.submit() (mais ne l'écrivez pas). Ce code lance l'action de soumettre le formulaire :
Bien entendu, rien ne se passera lorsque vous soumettrez votre formulaire car nous n'avons pas défini de paramètre ACTION dans la balise FORM (c'est à suivre...).
Pour l'instant, inscrivez un message de type ALERT indiquant "L'adresse de courriel indiquée est valide." :
alert("Votre adresse de courriel indiquée est valide.")
Maintenant, ajoute à ton formulaire un champ âge.
Ajoute à ta fonction, le bloc de code qui validera :
1) si l'âge indiquée est bien un nombre et
2) si le champ âge est vide.
À toi de trouver comment effectuer ces vérifications.
Piste : Utiliser Google avec les mots de recherche suivant :
- javascript isNaN
isNaN est une fonction javascript qui vérifie si une valeur n'est pas un nombre (Not a Number)
ou tout autre mot de recherche de ton choix.
- tu devras utiliser l'opérateur || (ou) afin de juxtaposer tes deux conditions à vérifier.
Exemple :
if( condition1 || condition2 )
{}
else
{}
Visualisez votre page et apportez des modifications au besoin.
