Verification d'un bouton radio

31 mars 2006, 17:33

Salut,

J'ai une question tres simple a vous poser. J'ai fait ce petit programme qui permet de choisir une reponse parmi 7 et je voudrai verifier si le bouton radio a bien ete coche ou pas :

<html>
<body>
<form name='f' method='post' action='page02.php' > 

<table border=0 align=center width="75%" cellpadding=15 cellspacing=0><br>
<tr>
  <td width=162>
  <b>Heureux (se). </b>  </td>
  <td width="35" colpsan=1>
  <input value=1 type=radio id=m1_1 name=m1><label for=m1_1>1</label>
  </td>
  <td width="25" colpsan=1>
  <input value=2 type=radio id=m1_2 name=m1><label for=m1_2>2</label>
  </td>
  <td width="31" colpsan=1>
  <input value=3 type=radio id=m1_3 name=m1><label for=m1_3>3</label>
  </td>
  <td width="20" colpsan=1>
  <input value=4 type=radio id=m1_4 name=m1><label for=m1_4>4</label>
  </td>
  <td width="20" colpsan=1>
  <input value=5 type=radio id=m1_5 name=m1><label for=m1_5>5</label>
  </td>
  <td width="20" colpsan=1>
  <input value=6 type=radio id=m1_6 name=m1><label for=m1_6>6</label>
  </td>
  <td width="20" colpsan=1>
  <input value=7 type=radio id=m1_7 name=m1><label for=m1_7>7</label>
  </td>
</tr>
</table>
<br>
<input type=hidden name=formnum value=2>
<center><input type=submit name=page3 value="Page suivante"></center>
</body>
</html>

j'ai bien compris qu'il faudra inserer du code javascript mais je ne sais pas comment le faire. si quelq'un peut m'aider? merci.

31 mars 2006, 17:42

modération : tu as bien compris qu'il fallait du code JavaScript ... mais tu postes dans "Débuter en PHP"

Je déplace ton post dans le forum "Javascript & AJAX" dans lequel il aura plus de réponses

31 mars 2006, 17:47

Ma réponse va peut-être te paraître complétement hors-sujet, mais as-tu songé à te tourner vers des outils pour te faciliter la création des formulaires ?
Je pense de suite à QuickForm, qui te permettrait facilement de mettre des règles sur tes formulaires pour vérifier leur validité.

31 mars 2006, 20:50

As tu effectué une recherche dans le forum Javascript avant de poster ?
avec en mot clé "radio" tout simplement

01 avr. 2006, 10:13

-> Truc

J'ai bien fait un tour dans le forum de javascript mais j'ai pas su comment integrer le javascript dans mon code php et comment verifier que le bouton radio a ete bien valide avant meme d'envoyer la page.

01 avr. 2006, 10:49

Bonjour

Une partie de solution a ton probléme fais en direct.

<html>
<head>
<script language="javascript" type="text/javascript"> 
function VerifCheck()
{ 
alert (document.f.test.value);
if(document.f.test.value == "") 
		{ 
        alert ('Aucun Check'); 
         return false; 
    	}
else {return true;}
}
</script>
</head>
<body> 
<form name="f" method="post" action="page02.php" onsubmit="return VerifCheck();"> 

<table border="0" align="center" width="75%" cellpadding="15" cellspacing="0"><br> 
<tr> 
  <td width="162"> 
  <b>Heureux (se). </b>  </td> 
  <td width="35" colpsan="1"> 
  <input value="1" type="radio" id="m1_1" name="m1" onClick="this.form.test.value = ('1'); "><label for="m1_1">1</label> 
  </td> 
  <td width="25" colpsan="1"> 
  <input value="2" type="radio" id="m1_2" name="m1" onClick="this.form.test.value = ('2');"><label for="m1_2">2</label> 
  </td> 
  <td width="31" colpsan="1"> 
  <input value="3" type="radio" id="m1_3" name="m1" onClick="this.form.test.value =('3');"><label for="m1_3">3</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="4" type="radio" id="m1_4" name="m1" onClick="this.form.test.value =('4');"><label for="m1_4">4</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="5" type="radio" id="m1_5" name="m1" onClick="this.form.test.value =('5');"><label for="m1_5">5</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="6" type="radio" id="m1_6" name="m1" onClick="this.form.test.value =('6');"><label for="m1_6">6</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="7" type="radio" id="m1_7" name="m1" onClick="this.form.test.value =('7');"><label for="m1_7">7</label> 
  </td> 
</tr> 
</table> 
<br>
<input type="hidden" name="test" id="test">
<input type="hidden" name="formnum" value="2"> 
<center><input type="submit" name="page3" value="Page suivante"></center> 
</body> 
</html>

@+ Dgse

01 avr. 2006, 11:38

-> Dgse

Merci bcp,j'ai bien teste et ca marche. C'est un truc simple mais j'avais besoin de votre aide! Thanks!

03 avr. 2006, 11:50

J'ai mis ce code pour tester mes boutons radio et j'ai remarque qu'il ne marche que pour une variable m1 et ne prend pa en compte la 2eme varaible m2 :

<html>
<head>
<script language="javascript" type="text/javascript">
function VerifCheck()
{
//alert (document.f.test.value);
if(document.f.test.value == "")
        {
        alert ('Cochez toutes les cases SVP');
         return false;
        }
else {return true;}
}
</script>
</head>
<body>
<form name="f" method="post" action="page02.php" onsubmit="return VerifCheck();">

<table border="0" align="center" width="75%" cellpadding="15" cellspacing="0"><br>
<tr>
  <td width="162">
  <b>Heureux (se). </b>  </td>
  <td width="35" colpsan="1">
  <input value="1" type="radio" id="m1_1" name="m1" onClick="this.form.test.value = ('1'); "><label for="m1_1">1</label>
  </td>
  <td width="25" colpsan="1">
  <input value="2" type="radio" id="m1_2" name="m1" onClick="this.form.test.value = ('2');"><label for="m1_2">2</label>
  </td>
  <td width="31" colpsan="1">
  <input value="3" type="radio" id="m1_3" name="m1" onClick="this.form.test.value =('3');"><label for="m1_3">3</label>
  </td>
  <td width="20" colpsan="1">
  <input value="4" type="radio" id="m1_4" name="m1" onClick="this.form.test.value =('4');"><label for="m1_4">4</label>
  </td>
  <td width="20" colpsan="1">
  <input value="5" type="radio" id="m1_5" name="m1" onClick="this.form.test.value =('5');"><label for="m1_5">5</label>
  </td>
  <td width="20" colpsan="1">
  <input value="6" type="radio" id="m1_6" name="m1" onClick="this.form.test.value =('6');"><label for="m1_6">6</label>
  </td>
  <td width="20" colpsan="1">
  <input value="7" type="radio" id="m1_7" name="m1" onClick="this.form.test.value =('7');"><label for="m1_7">7</label>
  </td>
</tr>
<tr>
  <td width="162">
  <b>Content (se). </b>  </td>
  <td width="35" colpsan="1">
  <input value="1" type="radio" id="m2_1" name="m2" onClick="this.form.test.value = ('1'); "><label for="m2_1">1</label>
  </td>
  <td width="25" colpsan="1">
  <input value="2" type="radio" id="m2_2" name="m2" onClick="this.form.test.value = ('2');"><label for="m2_2">2</label>
  </td>
  <td width="31" colpsan="1">
  <input value="3" type="radio" id="m2_3" name="m2" onClick="this.form.test.value =('3');"><label for="m2_3">3</label>
  </td>
  <td width="20" colpsan="1">
  <input value="4" type="radio" id="m2_4" name="m2" onClick="this.form.test.value =('4');"><label for="m2_4">4</label>
  </td>
  <td width="20" colpsan="1">
  <input value="5" type="radio" id="m2_5" name="m2" onClick="this.form.test.value =('5');"><label for="m2_5">5</label>
  </td>
  <td width="20" colpsan="1">
  <input value="6" type="radio" id="m2_6" name="m2" onClick="this.form.test.value =('6');"><label for="m2_6">6</label>
  </td>
  <td width="20" colpsan="1">
  <input value="7" type="radio" id="m2_7" name="m2" onClick="this.form.test.value =('7');"><label for="m2_7">7</label>
  </td>
</tr>
</table>
<br>
<input type="hidden" name="test" id="test">
<center><input type="submit" name="page3" value="Page suivante"></center>
</body>
</html>

Si quelqu'un peut me dire cmment faire pour resoudre ce pb! merci bcp!

03 avr. 2006, 18:37

Bonjour

Da la meme maniere que le 1er

<html> 
<head> 
<script language="javascript" type="text/javascript"> 
function VerifCheck() 
{ 
if(document.f.radiom1.value == "") 
        { 
        alert ('Cochez toutes les cases SVP'); 
         return false; 
        }
if(document.f.radiom2.value == "") 
        { 
        alert ('Cochez toutes les cases SVP'); 
         return false; 
        }  
else {return true;} 
} 
</script> 
</head> 
<body> 
<form name="f" method="post" action="page02.php" onsubmit="return VerifCheck();"> 

<table border="0" align="center" width="75%" cellpadding="15" cellspacing="0"><br> 
<tr> 
  <td width="162"> 
  <b>Heureux (se). </b>  </td> 
  <td width="35" colpsan="1"> 
  <input value="1" type="radio" id="m1_1" name="m1" onClick="this.form.radiom1.value = this.value; "><label for="m1_1">1</label> 
  </td> 
  <td width="25" colpsan="1"> 
  <input value="2" type="radio" id="m1_2" name="m1" onClick="this.form.radiom1.value = this.value;"><label for="m1_2">2</label> 
  </td> 
  <td width="31" colpsan="1"> 
  <input value="3" type="radio" id="m1_3" name="m1" onClick="this.form.radiom1.value = this.value;;"><label for="m1_3">3</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="4" type="radio" id="m1_4" name="m1" onClick="this.form.radiom1.value = this.value;"><label for="m1_4">4</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="5" type="radio" id="m1_5" name="m1" onClick="this.form.radiom1.value = this.value;"><label for="m1_5">5</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="6" type="radio" id="m1_6" name="m1" onClick="this.form.radiom1.value = this.value;"><label for="m1_6">6</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="7" type="radio" id="m1_7" name="m1" onClick="this.form.radiom1.value = this.value;"><label for="m1_7">7</label> 
  </td> 
</tr> 
<tr> 
  <td width="162"> 
  <b>Content (se). </b>  </td> 
  <td width="35" colpsan="1"> 
  <input value="1" type="radio" id="m2_1" name="m2" onClick="this.form.radiom2.value = this.value; "><label for="m2_1">1</label> 
  </td> 
  <td width="25" colpsan="1"> 
  <input value="2" type="radio" id="m2_2" name="m2" onClick="this.form.radiom2.value = this.value;"><label for="m2_2">2</label> 
  </td> 
  <td width="31" colpsan="1"> 
  <input value="3" type="radio" id="m2_3" name="m2" onClick="this.form.radiom2.value = this.value;"><label for="m2_3">3</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="4" type="radio" id="m2_4" name="m2" onClick="this.form.radiom2.value = this.value;"><label for="m2_4">4</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="5" type="radio" id="m2_5" name="m2" onClick="this.form.radiom2.value = this.value;"><label for="m2_5">5</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="6" type="radio" id="m2_6" name="m2" onClick="this.form.radiom2.value = this.value;"><label for="m2_6">6</label> 
  </td> 
  <td width="20" colpsan="1"> 
  <input value="7" type="radio" id="m2_7" name="m2" onClick="this.form.radiom2.value = this.value;"><label for="m2_7">7</label> 
  </td> 
</tr> 
</table> 
<br> 
<input type="hidden" name="radiom1" id="radiom1">
<input type="hidden" name="radiom2" id="radiom2"> 
<center><input type="submit" name="page3" value="Page suivante"></center> 
</body> 
</html>

@+ Dgse

04 avr. 2006, 12:18

-> Dgse

Merci bcp pour ton aide. C'est simple et ca marche !

04 avr. 2006, 14:58

-> Dgse

Merci bcp pour ton aide. C'est simple et ca marche !

en reprenant le code de Dgse mais en l'optimisant (si tu as 100 boutons tu ne vas pas faire 100 fois la même ligne de code, si?) :

Code : Tout sélectionner

<script language="javascript" type="text/javascript">
function VerifCheck()
{
    var formulaire = document.forms['f'].elements['m1'];
    for (var i = 0; i < formulaire.length; i++)
    {
        if (formulaire.options[i].checked == false)
        {
               alert ('Cochez toutes les cases SVP');
        }
    }
}
</script>

Je n'ai pas vérifier mais ca devrait etre quelque chose comme ca.

04 avr. 2006, 16:05

-> Snoops

Merci pour ton aide. Mais a ce moment la suis-je oblige de toujours mettre ce code dans input :
onClick="this.form.radiom2.value = this.value;" (par exple)

car sinon je vois pas ou tu as optimise le code de Dgse?

Thanks!

04 avr. 2006, 17:17

Bonjour

il teste dans une boucle si une des cases est coché si je ne m'abuse.

@+

04 avr. 2006, 17:23

-> Unknown

Oui je sais que c'est un test pour voir si toutes les cases sont cochées. Mais ce qui m'interesse c'est de faire un truc optimisé pour les varaibles m. Si j'ai plusieurs varaibles m comment faire pour optimiser la verifications?

04 avr. 2006, 18:31

-> Unknown

Oui je sais que c'est un test pour voir si toutes les cases sont cochées. Mais ce qui m'interesse c'est de faire un truc optimisé pour les varaibles m. Si j'ai plusieurs varaibles m comment faire pour optimiser la verifications?

1) Désolé je n'avais pas vu la deuxième variable m2, mais j'avais optimsé de facon que l'utilisateur puisse cocher toutes ses cases, puis lors du click sur un bouton vérifier...

Et pourrais tu m'expliquer plus exactement ce que tu veux faire stp, parce que je ne suis pas sur de bien avoir compris?
Pour etre sur que je ne fasses pas hors sujet ...

2) Connais tu a l'avance le nombre de variables m que tu auras ? et est-ce toujours la même facon de les appelées? m1, m2, m3 ... ?

Si oui au 2 questions ca devrait te donner ça (normalement) :

- Si tu as un bouton pour chacun des groupes de cases :

Code : Tout sélectionner

<script language="javascript" type="text/javascript"> 
function VerifCheck(nom) 
{ 
    var formulaire = document.forms['f'].elements[nom]; 
    for (var i = 0; i < formulaire.length; i++) 
    { 
        if (formulaire.options[i].checked == false) 
        { 
               alert ('Cochez toutes les cases SVP'); 
        } 
    } 
} 
</script>

et ton bouton :

Code : Tout sélectionner

<input type="button" value="Vérifier" onclick="VerifCheck(mX);">

(où X = le numéro du groupe de cases)

Verification d'un bouton radio

Qui est en ligne