IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Verification de Formulaire bouton radio


Sujet :

JavaScript

  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    85
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 85
    Par défaut Verification de Formulaire bouton radio
    Bonjour à tous,
    j'ai plusieurs inputs type radio et j'aimerai savoir si un choix est sélectionné:
    Dans le but de vérifier si toutes mes question on était répondu avant l'envoi du formulaire
    mes inputs;
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
     
    <input type="radio" name="question1" value="1" />
    <input type="radio" name="question1" value="2" />
    <input type="radio" name="question1" value="3" />
    <input type="radio" name="question1" value="4" />
     
    <input type="radio" name="question2" value="1" />
    <input type="radio" name="question2" value="2" />
    <input type="radio" name="question2" value="3" />
    <input type="radio" name="question2" value="4" />
     
    etc....
    et mon Javascript:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    function valid_form(thisForm) { 
    	tmp = 'question1'; // mit à un pour faire un test je ferai la boucle plus tard
    	for(j = 0; j < document.formulaire.tmp.length; j++){
    		if(!document.formulaire.tmp[j].checked) {
    			alert( "Veulliez répondre à toutes les questions");
    			return false;
                     }	else {
    				alert( "Question Répondu"); 
    				return false; // mit a false expret pour empecher l envoie pendant la periode de test
    		         }
    	 } 
    }
    sauf que mon JS ne marche pas du tout... Quelqu'un serait-il m'aider?

    Merci

    Cordialement

  2. #2
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    85
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 85
    Par défaut
    Petit modif, j'ai essaie en virant les document.formulaire vu que cela ce passe deja dans le formulaire (thisFrom)
    donc j'ai:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
     
    function valid_form(thisForm) { 
     
    	 var tmpo = "question1";
    	for(j = 0; j < (tmpo.length); j++){
    		if(!tmpo[j].checked) {
    			alert("Les boutons radios doivent etre tous remplit");
    			return false;
    		}	else if(tmpo[j].checked){
    				alert("Bouton Selectionné"); 
    				return false;
    			} else{
    					alert("le script n'a pas marché");
    					return false;
    				}
    	} 
    }
    Mais encore un petit probleme: dans tout les cas (bouton radio selectionné ou non) il affiche 'Les boutons radios doivent etre tous remplit' donc si il est checked il passe quand meme en non checked...

  3. #3
    Membre très actif Avatar de polkduran
    Profil pro
    Consultant informatique
    Inscrit en
    Décembre 2009
    Messages
    155
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Consultant informatique
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2009
    Messages : 155
    Par défaut
    Citation Envoyé par bastian06n Voir le message
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    function valid_form(thisForm) { 
     
    	 var tmpo = "question1";
    	for(j = 0; j < (tmpo.length); j++){
    		if(!tmpo[j].checked) {
    Comme ca il me semble que t'as fait tmpo = "question1" donc tmpo et une chaine de caractères et donc , je pense que si tu fait thisForm[tmpo] (tas ton objet radio cette fois) ça pourrait marcher.

    Et dans ton premier code tu fais form.tmp[j].checked ca marche pas car il pense récupérer un élément appelé tmp dans le form il faut que tu fasse dans ce cas-là form[tmp] pour qu'il te retourne l'élément dont le nom est le contenu de tmp et no "tmp", je suis tombé plusieurs fois sur ce type de pièges.

    moi j'ai fait comme ca :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
     
    <form id="leForm" onsubmit="return validForm(this);">
     
    <input type="radio" name="question1" value="1" /><br />
    <input type="radio" name="question1" value="2" /><br />
    <input type="radio" name="question1" value="3" /><br />
    <input type="radio" name="question1" value="4" /><br />
     <br /><br />
    <input type="radio" name="question2" value="1" /><br />
    <input type="radio" name="question2" value="2" /><br />
    <input type="radio" name="question2" value="3" /><br />
    <input type="radio" name="question2" value="4" /><br />
     
    <input type="submit" value="go"/>
    </form>
    <script type="text/javascript">
    function validForm(form){
     
    	//liste des noms des radios, facile à mantenir
    	var questions = ["question1","question2"];
     
    	//pour chaque name de radio dans la liste
    	for(var i in questions){
    		//on recupère l'objet radio
    		var radio = form[questions[i]];
    		//si un seul radio n'est pas conforme on s'arrête et on renvoie false
    		if(isRadioChecked(radio) == false)
    			return false;
    	}
    	//si on est ici, ça veut dire qu'on a vérifié tous les radios
    	//et aucun n'a retourné false donc tout va bien (au moins un radio checked par name)
    	return true;
     
    }
    function isRadioChecked(radio){
    	//étant donné que plusieurs radio possèdent le même name,
    	// on a une liste de inputs radio pour chaque name
    	var c = radio.length;
    	//on parcourt l'ensemble des inputs pour un name donné
    	while(c>0){
    		c--;
    		//si il y a un radio checked tout est ok pour le name courant,
    		//donc on s'embete pas et on renvoie true;
    		if(radio[c].checked) 
    			return true;
    	}
    	//si on n'a pas renvoyé true avant aucun input pour un name donné est checked
    	return false;
    }
     
    </script>
    Ca marche sur IE et chrome, pas testé sur FF

  4. #4
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    85
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 85
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
     
    function valid_form(thisForm) { 
     
    	var tmp= "question1";
    	for(j = 0; j < (thisForm[tmp].length); j++){
    		if(thisForm[tmp][j].checked == true) {
    			alert("button selectionné");
    			return false;
    		}	else if(thisForm[tmp][j].checked == false) {
    				alert("Les boutons radios doivent etre tous remplit");
    				return false;
    			}else {
    				alert("script pas marché"); 
    				return false;
    			} 
    	} 
    }

    Super Ça marche !!! Merci beaucoup j'aurais jamais trouvé sinon :p

  5. #5
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    85
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 85
    Par défaut
    En faite non..... ca marche si je sélectionne le premier bouton mais si je sélectionne les autres ca fait comme si il n'était pas coché

  6. #6
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    85
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 85
    Par défaut
    bon je vais utiliser ton code alors merci bcp du coup de main

  7. #7
    Membre très actif Avatar de polkduran
    Profil pro
    Consultant informatique
    Inscrit en
    Décembre 2009
    Messages
    155
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Consultant informatique
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2009
    Messages : 155
    Par défaut
    Citation Envoyé par bastian06n Voir le message
    En faite non..... ca marche si je sélectionne le premier bouton mais si je sélectionne les autres ca fait comme si il n'était pas coché
    Ton code ne marche pas car dans ta boucle si tu truove un radio checked ok il te renvoie true, mais le problème c'est que si tu trouve un radio pas sélectionné il te renvoie false, du coup au premier radio pas sélectionné il renvoie false et il ne verifie même pas les autres, tu aurais dû mettre ton "return false" à la sortie de la boucle, c'est à dire si ta boucle n'a jamais renvoyé true, donc aucun radio sélectionné.

    Et aussi ton code tu le fais pour un seule radio, tu dois inclure une autre boucle pour chaque "name" différent dans ton form.

  8. #8
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    85
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 85
    Par défaut
    Merci polkduran pour ces explications, je comprends mieux maintenant pourquoi ca fonctionnait pas :/

    En me servant de ton exemple je me demandais si il était possible de remplir le tableau
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    var questions = ["question1","question2"];
    dynamiquement avec une requête sql afin de les sélectionner dans une table ?

    J'ai lu sur internet que l'on pouvait le faire avec AJax qui appellerai un script php mais je me demande bien comment les variable php pour être réutilisées dans le tableau javascript.

  9. #9
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    85
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 85
    Par défaut
    Ou plustôt appeler la fonction validform avec 2 paramètre ou le 2eme paramètre serai le résultat de la requête SQL en php mais a ce moment là; est ce possible de déclarer un tableau (je crois que ca s'appel un vecteur en php) qui soit compatible (au niveau de la forme) avec les tableaux javascript ?

  10. #10
    Membre très actif Avatar de polkduran
    Profil pro
    Consultant informatique
    Inscrit en
    Décembre 2009
    Messages
    155
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Consultant informatique
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2009
    Messages : 155
    Par défaut
    Le problème, bon ce n'est pas un problème mais la différence entre js et php c'est que js est côté client et php côté serveur, c'est à dire que tu prépares avec php ce que tu veux envoyer au navigateur.

    tu peux te servir de php pour générer du js dynamiquement mais une fois que tout est envoyé au client (html,js,css) tu peux plus faire appel au php qui t'a généré tout ça.

    je ne sais pas par contre comment tu génères tes radios, tu les mets en dur en html ou tu les fais en php,

    je pense qu'au lieu de vouloir mélanger génération de js en php et js côté client tu peux tu faire tout en js, parce que même si c'est pas très compliqué de le faire si t'as pas l'habitude tu peux passer bcp de temps à le faire.

    donc en js tu peux d'abord récupérer tous les names des radios dans un tableau

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
     
    function getRadios(form){
    	//on recupère tous les inputs
    	var is = form.getElementsByTagName("input");
    	//ici on va mettre tous les names des radios
    	var tab = new Array();
    	for(var i = 0;i<is.length;i++){
    		var t = is[i].getAttribute("type");
    		//si le type de l'input est radio
    		if(t=="radio"){
    			//on recupère le name du radio
    			var name = is[i].getAttribute("name");
    			//s'il n'existe dans le tableau on l'y insère
    			if(!tab.contains(name)){
    				tab.push(name);
    			}
    		}
    	}
    	return tab;
    }
    dans cette fonction on a utilisé une méthode de Array qui en réalité n'existe pas Array.contains(element), donc il faut la redéfinir d'abord;

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    if(!Array.contains)
    Array.prototype.contains = function (element) {
    	for (var i = 0; i < this.length; i++) {
    		if (this[i] == element) {
    			return true;
    		}
    	}
    	return false;
    }
    et finalement dans la fonction où on utilisait le tableau de radios on fait

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    function validForm(form){
     
    	//liste des noms des radios, facile à mantenir
    	var questions =getRadios(form);
    .......

  11. #11
    Membre confirmé
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    85
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 85
    Par défaut
    re =)

    je ne sais pas par contre comment tu génères tes radios, tu les mets en dur en html ou tu les fais en php,
    je les affichage dynamiquement en fonction d'un table SQL en php,

    tu peux te servir de php pour générer du js dynamiquement mais une fois que tout est envoyé au client (html,js,css) tu peux plus faire appel au php qui t'a généré tout ça.
    J'étais en train de coder quelque chose comme cela. Mais je suis arriver au problème de l'ajout de deux tableau (pour des questions qui sont dans deux table SQL différentes) et là, panique, j'avais comme idée en tête une fonction qui aller echo un array dans le js avec mes valeur obtenu en SQL trop de boulot effectivement.


    En tout cas ta solution me semble beaucoup plus pratique car imaginons que j'ai une troisième table de questions je vais devoir modifier tout monde code php dans le javascript alors qu'avec le tiens pas la peine

    Tes Fonctions tournent à merveilles ! Un énorme Merci à toi tu me débloque d'une sacré situation merci merci merci

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [2.x] formulaire bouton radio javascript
    Par lodizzz dans le forum Symfony
    Réponses: 1
    Dernier message: 16/08/2012, 10h39
  2. [Débutant] Formulaires - boutons radio
    Par gletare dans le forum Langage
    Réponses: 1
    Dernier message: 01/07/2006, 11h56
  3. Formulaire : boutons radio
    Par mosquitout dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 23/04/2006, 14h58
  4. Formulaire bouton radio
    Par yaka2 dans le forum Langage
    Réponses: 7
    Dernier message: 28/02/2006, 11h00
  5. verif de formulaire et boutons radio
    Par Invité dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 07/02/2006, 22h42

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo