axelandre | Bonsoir à tous,
Je m'arrache les cheveux sur un script que je n'arrive pas à faire fonctionner.
J'ai un formulaire sur lequel je souhaite effectuer des controles en javascript mais ils ne fonctionnent pas.
Alors j'ai créé différentes fonctions situées dans un meme fichier "formulaire.js".
Voici mon formulaire à controler :
Code :
- <form method="post" action="index.php?accueil=verification&verification=ajoutpersonne" name="ajoutpersonne" onSubmit="return validation(this);">
- <tr>
- <td>Que voulez-vous ajouter : </td>
- <td><input type="radio" name="type" value="eleve" onclick="ajouter(this, 'eleve');" onchange="enlever(this, 'eleve');"/> Elève    
- <input type="radio" name="type" value="prof" onclick="ajouter(this, 'prof');" onchange="enlever(this, 'prof');"/> Professeur    
- <input type="radio" name="type" value="admin" onclick="ajouter(this, 'admin');" onchange="enlever(this, 'admin');"/> Administrateur
- </td>
- </tr>
- <tr>
- <td><br/></td><!--------Création d'u espace entre les informations------>
- </tr>
- <tr>
- <td>Son nom : </td>
- <td><input type="text" name="nom" onChange="test_vide(this, 'Le nom manque', 'led_nom');"/>   <img src="./images/correct.jpg" name="led_nom" border="0"/></td>
- </tr>
- <tr>
- <td>Son prénom : </td>
- <td><input type="text" name="prenom" onChange="test_vide(this, 'Le prénom manque', 'led_prenom');"/>   <img src="./images/correct.jpg" name="led_prenom" border="0"/></td>
- </tr>
- <tr>
- <td>Son adresse : </td>
- <td><input type="text" name="adresse" onChange="test_vide(this, 'L'adresse manque', 'led_adresse');"/>   <img src="./images/correct.jpg" name="led_adresse" border="0"/></td>
- </tr>
- <tr>
- <td>Ville : </td>
- <td><input type="text" name="ville" onChange="test_vide(this, 'La ville manque', 'led_ville');"/>   <img src="./images/correct.jpg" name="led_ville" border="0"/></td>
- </tr>
- <tr>
- <td>Code postal : </td>
- <td><input type="text" name="cp" onChange="test_valeur(this, 'Le code postal manque', 'led_cp');"/>   <img src="./images/correct.jpg" name="led_cp" border="0"/></td>
- </tr>
- <!----Cette ligne sera ajoutée si le bouton radio élève est sélectionné---->
- <!--display:none permet de cacher la ligne.C'est cette info que l'on va modifier grace au javascript en fonction de se que sélectionne l'utilisateur-->
- <!----Appel de la fonction javascript formulaire.js---->
- <tr id="eleve" style="display:none">
- <td>Sa classe : </td>
- <td><input type="text" name="classe" onChange="test_vide(this, 'La classe manque', 'led_classe');"/>   <img src="./images/correct.jpg" name="led_classe" border="0"/></td>
- </tr>
- <!----Cette ligne sera ajoutée si le bouton radio prof est sélectionné---->
- <!----Appel de la fonction javascript formulaire.js---->
- <tr id="prof" style="display:none">
- <td>Matière enseignée : </td>
- <td><input type="text" name="matiere" onChange="test_vide(this, 'La matiere manque', 'led_matiere');"/>   <img src="./images/correct.jpg" name="led_matiere" border="0"/></td>
- </tr>
- <!----Cette ligne sera ajoutée si le bouton radio admin est sélectionné---->
- <!----Appel de la fonction javascript formulaire.js---->
- <tr id="admin" style="display:none">
- <td>Son statut : </td>
- <td><input type="text" name="statut" onChange="test_vide(this, 'Le statut manque', 'led_statut');"/>   <img src="./images/correct.jpg" name="led_statut" border="0"/></td>
- </tr>
- <tr>
- <td><br/></td><!--------Création d'u espace entre les informations------>
- </tr>
- <tr>
- <td colspan="2" align="center"><input type="submit" value="AJOUTER"/></td>
- </tr>
- </form>
|
Et maintenant voici mon code javascript permettant d'effectuer les controles :
Code :
- //CONTROLE SUR LE CHOIX DE LA PERSONNE
- function enlever(btn, champ)
- {
- if(btn.unchecked)
- {
- document.getElementById(champ).style.display="inline";
- }
- else
- {
- document.getElementById(champ).style.display="none";
- }
- }
- function ajouter(btn, champ)
- {
- if(btn.checked)
- {
- document.getElementById(champ).style.display="inline";
- }
- else
- {
- document.getElementById(champ).style.display="none";
- }
- }
- //DECLARE LE TABLEAU CONTENANT LES VALEURS DES LED
- function init()
- {
- flag = new array(8);
- flag['led_nom'] = false;
- flag['led_prenom'] = false;
- flag['led_adresse'] = false;
- flag['led_ville'] = false;
- flag['led_cp'] = false;
- flag['led_classe'] = false;
- flag['led_matiere'] = false;
- flag['led_statut'] = false;
- document.forms[0].nom.select();
- document.forms[0].nom.focus();
- }
- //TEST SI CHAMP VIDE OU NON
- function test_vide(champ, texte, led)
- {
- with(champ) //Pour le champ en parametre
- {
- if(document.formulaire.champ.value == null || document.formulaire.champ.value == '') //si valeur numérique est null ou si pas de caractère alors
- {
- document.formulaire.images[led].src="incorrect.jpg"; //met la led à incorrect
- flag[led] = false; //mémorise le champs faux pour ce champ
- if(texte != '') //si il y a du texte alors tu l'affiche(ici ca affichera le texte de base
- {
- alert(texte);
- document.formulaire.champ.focus();
- }
- champ.select(); //resélectionne le champ
- champ.focus(); //resélectionne le contenu
- return false; //retourne faux
- }
- else //sinon
- {
- flag[led] = true; //mémorise ok pour ce champ
- document.images[led].src="correct_vert.jpg"; //passe le flag en correct_vert
- return true; //retourn vrai
- }
- }
- }
- //CONTROLE SUR LES CHAMPS NUMERIQUES
- function test_valeur(champ, texte, param, led)
- {
- with(champ)
- {
- valeur = lenght(value); //lie la valeur et compare la avec la valeur entrée en paramètre
- texte = parseInt(value); //permet de vérifier si il y a du texte. Car si c'est le cas alors texte aura pour valeur "0" puisque le texte à pour valeur numérique 0.
- if( valeur != param || value != valeur)
- {
- document.images[led].src="incorrect.jpg";
- flag[led] = false;
- if(texte != "" )
- {
- alert(texte);
- }
- champ.select();
- champ.focus();
- return false;
- }
- else
- {
- flag[led] = true;
- document.images[led].src="correct_vert.jpg";
- return true;
- }
- }
- }
- //CONTROLE SUR ADRESSE EMAIL
- function test_email(champ, texte, led)
- {
- with(champ)
- {
- apos = value.indexOf("@" ); //cherche la position de l'arobase
- dotpos = value.lastIndexOf("." ); //cherche la position du point
- lastpos = value.lenght-1; //controle si l'adresse est vraissemblable
- if(apos < 1 || dotpos-apos < 2 || lastpos-dotpos > 3 || lastpos-dotpos < 2)
- {
- document.images[led].src="incorrect.jpg";
- flag[led] = false;
- if(texte != "" )
- {
- alert(texte);
- }
- champ.select();
- champ.focus();
- return false;
- }
- else
- {
- flag[led] = true;
- document.images[led].src="correct_vert.jpg";
- return true;
- }
- }
- }
- function validation(champ)
- {
- with(champ)
- {
- if(test_vide(nom, 'Veuillez indiquer le nom', 'led_nom') == false)
- {
- nom.select(); nom.focus(); return false;
- }
- if(test_vide(prenom, 'Veuillez indiquer le prénom', 'led_prenom') == false)
- {
- prenom.select(); prenom.focus(); return false;
- }
- if(test_vide(adresse, 'Veuillez indiquer l\'adresse', 'led_adresse'))
- {
- adresse.select(); adresse.focus(); return false;
- }
- if(test_vide(ville, 'Veuillez indiquer la ville', 'led_ville') == false)
- {
- ville.select(); ville.focus(); return false;
- }
- if(test_valeur(cp, 'Veuillez indiquer le code postal', 'led_cp'))
- {
- cp.select(); cp.focus(); return false;
- }
- if(test_vide(classe, 'Veuillez indiquer la classe de l\'élève', 'led_classe'))
- {
- classe.select(); classe.focus(); return false;
- }
- if(test_vide(matiere, 'Veuillez indiquer la matiere qu\'enseigne le professeur', 'led_matiere'))
- {
- matiere.select(); matiere.focus(); return false;
- }
- if(test_vide(statut, 'Veuillez indiquer le statut de du nouvel administrateur', 'led_statut'))
- {
- statut.select(); statut.focus(); return false;
- }
- return true;
- }
- }
|
Alors, les deux première vérification, c'est à dire celles qui controle les boutons "radio" fonctionnent mais pour ce qui est du reste pas moyen de trouver d'où vient le problème.
Si quelqu'un a une solution à mon problème je suis preneur !
Merci par avance de votre aide.
|