Verification radio avant envoi

**spawns** · 15/01/2009, 13h20

slt à tous
j'ai un petit blem sur un verif de formulaire et plus précisement sur les radio.

j'explique mes radio sont géneres auto via un bdd php
bdd "poids"
variable externe $thep

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
echo'<form action="?rub=panierrecap&prod" method="post" name="frm" onsubmit="return ctr();" >';
$req13 = mysql_query("SELECT * FROM poids WHERE $thep BETWEEN tranch1 AND tranch2") or die("Erreur SQL13 !"); 
	while($data13 = mysql_fetch_array($req13)) {
	echo'<table><tr><td class="cad03 centrage"><input type="radio" name="choix" value="'.$data13[id].'"></td>
	<td class="cad03">'.$data13[trans].'</td>
	<td class="cad07">'.$data13[infos].'</td>
	<td class="cad03 droite">'.$data13[prix].' €</td>
	</tr></table><br />';
	}
echo'<input type="submit" value="CONTINUER" class="boutonlien" >
</form>';

je vérifie qu'au moins un des radios est cochés.

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
<script type="text/javascript">
    function ctr()
	{
   n=frm.choix.length;
   var checkvalue = '';
   for (i=0; i<n; i++)
   {
	 if (frm.choix[i].checked)
     {
         checkvalue = frm.choix[i].value;
         break;
     }
   }
   if(checkvalue == '')
   {
       alert('veuillez sélectionner une option de port !')
       return(false);
   }
}	
</script>

cela fonctionne quand j'ai plus d'un radio qui est généré, mais cela ne marche plus si j'en ai qu'un.

ou est mon blem ???
Merci d'avance de votre aide.
@+

**le_chomeur** · 15/01/2009, 13h32

bonjour,
Merci de poster le code HTML généré et non le code php.

**spawns** · 15/01/2009, 13h36

Pardon
voici le code de la page

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<form action="?rub=panierrecap&prod" method="post" name="frm" onsubmit="return ctr();" >54Livraison impossible avec ce poids de colisLivraison impossible avec ce poids de colisLivraison impossible avec ce poids de colis
<table><tr><td class="cad03 centrage"><input type="radio" name="choix" value="4"></td>
	<td class="cad03">la poste</td>
	<td class="cad07"></td>
	<td class="cad03 droite">50 â‚¬</td>
	</tr></table><br /><table>
<tr><td class="cad06 droite"></td>
<td  class="cad05 droite" ><input type="submit" value="CONTINUER" class="boutonlien" >
<img class="vertical" src="./img/arrow.png" alt="" /></td></tr>
</table>
</form>

**le_chomeur** · 15/01/2009, 13h46

tout simplement parce que :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

n=frm.choix.length;

ne renvois pas une taille mais undefined s'il n'y a qu'un seul élément puisqu'il ne s'agit plus d'un tableau mais d'un simple objet
solution , si undefined alors , récupérer directement l'objet

**spawns** · 15/01/2009, 13h48

Merci pour ton aide
mais comment tu traduits ca en code ???

**le_chomeur** · 15/01/2009, 14h05

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
n = (frm.choix.length != "undefined") ? frm.choix.length:frm.choix;
var checkvalue = '';
if(typeof(n) == number){
   for (i=0; i<n; i++)
   {
	 if (frm.choix[i].checked)
     {
         checkvalue = frm.choix[i].value;
         break;
     }
   }
}
else{
 if (frm.choix.checked)
     {
         checkvalue = frm.choix.value;
         break;
     }
}
...

un truc dans ce genre

**spawns** · 15/01/2009, 14h10

Re
oui mais non
car cela ne fonctionne pas.
si je ne coche pas le radio cela ne me dis rien alors que cela devrait m'indiquer de cocher le radio

**le_chomeur** · 15/01/2009, 14h43

je t'ai donné une explication pour résoudre ton problème , il y a surement un bug , car j'ai tapé de tête ... tu as les grandes lignes

**spawns** · 15/01/2009, 14h49

si tu veux le code d'origine
il est dans le 1er post.

Comme je maîtrise pas trop le javascript j'ai un peu de mal à debugger

**E.Bzz** · 15/01/2009, 15h00

Bonjour,

Envoyé par spawns

si tu veux le code d'origine
il est dans le 1er post.

je pense qu'il l'aurait retrouvé tout seul

Normalement il suffit de remplacer les "..." de la fin du code donné par le tien

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
   if(checkvalue == '')
   {
       alert('veuillez sélectionner une option de port !')
       return(false);
   }

A+

**spawns** · 15/01/2009, 15h02

c'est ce que j'ai fait mais ca change rien

voila le code avec les modifs :

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
 
<script type="text/javascript">
    function ctr()
	{
n = (frm.choix.length != "undefined") ? frm.choix.length:frm.choix;
var checkvalue = '';
if(typeof(n) == number){
   for (i=0; i<n; i++)
   {
	 if (frm.choix[i].checked)
     {
         checkvalue = frm.choix[i].value;
         break;
     }
   }
}
else{
 if (frm.choix.checked)
     {
         checkvalue = frm.choix.value;
         break;
     }
}
   if(checkvalue == '')
   {
       alert('veuillez sélectionner une option de port !')
       return(false);
   }
}	
</script>

**franculo_caoulene** · 15/01/2009, 15h33

Pourquoi ne pas cocher un bouton radio par défaut? C'est ce que je fais toujours. Au mieux l'utilisateur n'a pas à cliquer, au pire il doit cliquer. Chose qu'il est obligé de faire si tu crées un contrôle.

**E.Bzz** · 15/01/2009, 15h48

Envoyé par franculo_caoulene

Au mieux l'utilisateur n'a pas à cliquer, au pire il doit cliquer.

Je vois encore pire : il oublie qu'il faut cliquer (ou s'en tape), et il n'y a pas de contrôle possible.

Ne rien sélectionner l'oblige à choisir.

A+

**franculo_caoulene** · 15/01/2009, 15h55

Envoyé par E.Bzz

Je vois encore pire : il oublie qu'il faut cliquer (ou s'en tape), et il n'y a pas de contrôle possible.

Ne rien sélectionner l'oblige à choisir.

A+

A choisir n'importe quoi? Ca revient au même...

**E.Bzz** · 15/01/2009, 16h03

Envoyé par franculo_caoulene

A choisir n'importe quoi? Ca revient au même...

Pas vraiment : dans ce cas c'est un acte volontaire, et suivant le domaine (fonctionnel) de l'application, le résultat est différent (s'il y a un problème de responsabilité, par exemple).

Ici, pour des options de port, apparemment :
Si le marseillais qui a commandé son lave-vaisselle oublie de changer le choix par défaut "Tenir le produit à ma dispo dans votre entrepôt de Lille", ça peut aussi faire grincer des dents (alors que ça sera une erreur d'inattention "de bonne foi").

Par contre, pour un formulaire dans un blog, je t'accorde que ça n'a aucune importance

A+

**spawns** · 15/01/2009, 16h10

Oui d'accord avec toi E.Bzz

c'est pourquoi il faut absolument qu'au moins un bouton soit coché et même s'il n'y a qu'un choix possible il faut que l'internaute le coche lui.

le code actuel ne fonctionne pas car si aucun radio n'ai coché cela valide tout de même le formulaire.

**franculo_caoulene** · 15/01/2009, 16h18

Bon ben si vous insistez

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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
   <title>tester si un bouton radio est coché</title>
   <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
   <style type="text/css">
   </style>
</head>
<body>
   <form id="f" method="post">
      <input id="c1" name="c" type="radio" value="1" />
      <input id="c2" name="c" type="radio" value="2" />
      <input id="c3" name="c" type="radio" value="3" />
      <input id="s" type="submit" value="soumettre" />
   </form>
   <script type="text/javascript">
   var Utils = {
      Evenement: {
         ajouter: function(elm, evt, fn) {
            if (document.addEventListener) {
               if (!elm.length || elm.elements) {
                  elm.addEventListener(evt, function(e) {
                     if (!fn(e)) {e.preventDefault();}
                  }, false);
               } else {
                  for (var i = 0, imax = elm.length; i < imax; i++) {
                     elm[i].addEventListener(evt, function(e) {
                        if (!fn(e)) e.preventDefault();
                     }, false);
                  }
               }
            } else if (document.attachEvent) {
               if (!elm.length || elm.elements) {
                  var r = elm.attachEvent("on" + evt, fn);
                  return r;
               } else {
                  for (var i = 0, imax = elm.length; i < imax; i++) {
                     var r = elm[i].attachEvent("on" + evt, fn);
                     return r;
                  }  
               }
            }
         }
      },
      Formulaire: {
         /****** partie intéressante ******/
         obtenirValeur: function(elms) {
            var r = false;
            for (var i=0, imax=elms.length; i<imax; i++) {
               if (elms[i].checked) {
                  r = true;
                  break;
               };
            }
            return r;
         }
         /****** partie intéressante ******/
      }
   }
   Utils.Evenement.ajouter(document, "submit", function(e){
      var elm = e.Target || e.srcElement;
      /****** partie intéressante ******/
      var cs = document.getElementsByName("c");
      return Utils.Formulaire.obtenirValeur(cs);
      /****** partie intéressante ******/
   });
 
   </script>
</body>
</html>

**E.Bzz** · 15/01/2009, 16h19

Envoyé par spawns

le code actuel ne fonctionne pas car si aucun radio n'ai coché cela valide tout de même le formulaire.

Oui, et en regardant rapidement, je vois pas pourquoi

Tu peux essayer autrement :
en partant du principe qu'une fois un des radios coché, l'utilisateur n'a plus les moyens (sauf script adequat que tu ajouterais dans la page), de rendre tous les radios décochés, il suffit de gérer une variable booléenne (globale)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<head>
<script type="text/javascript">
var blnCoche = false;
...

avec sur chaque radio

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick="blnCoche = true;"

Ta fonction de vérif devrait être beaucoup plus simple

EDIT : oui, je sais, il y a plus esthétique

Mais plus simple ?

A+

**spawns** · 15/01/2009, 16h30

cela ne fonctionne pas non plus,
j'ai integré

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick="blnCoche = true;"

dans mes radio
et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var blnCoche = false;

dans la fonction et même hors de la fonction ca ne marche pas on peut toujours valider sans que cela soit cocher

**E.Bzz** · 15/01/2009, 16h39

Envoyé par spawns

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var blnCoche = false;

dans la fonction et même hors de la fonction ca ne marche pas on peut toujours valider sans que cela soit cocher

Tu n'aurais pas oublié quelque chose ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
function ctr()
{
   return blnCoche;
}

C'est ce que je voulais dire par

Envoyé par E.Bzz

Ta fonction de vérif devrait être beaucoup plus simple

EDIT : et c'est bien "hors de la fonction"

A+

Verification radio avant envoi

JavaScript

Discussions similaires

Partager

Partager