cocher tous les boutons radio

mais dont l'id est une variable

Sujet résolu

10 juin 2010 à 22:13:29

Bonjours à tous et à toutes !

Je suis bloqué depuis plusieurs jours sur un script qui est pourtant très simple :

On appuie sur un bouton et tous les boutons 'radios' d'un certain type sont cochés. En sachant que le nombre de boutons est conditionné par le nombre d'entrées dans un array.

Etant un débutant (soit, un noob) en javascript, j'ai essayé une technique.

Voici d'abord les premières variables :

<?php
$array = array(1, 2, 3, 4); //l'array en question dont les données pourraient être très bien des chaînes de caractère
$e = 0; //une simple variable
?>

Ensuite le formulaire et sa boucle :

<form>
<?php foreach($array as $temp)
	{ ?>
	<input type="radio" name="maradio<?php echo $e; ?>" value="oui" id="<?php echo $temp; ?>"/> OUI <!--$e servant simplement à donner un nom différent aux radios-->
	<input type="radio" name="maradio<?php echo $e; ?>" value="non" id="<?php echo $temp; ?>"/> NON <br />
<?php $e++; //on rajoute +1 à $e pour en changer le nom
	} ?>

	<input type="button" id="select" onclick="select()" value="Tout sélectionner"/> <!--on clique sur le bouton ce qui exécute un script JS-->
</form>

Voici le script en question :

<script type="text/javascript">
	function select()
		{
</script>
<?php
		foreach($array as $temp)/*on lance une boucle php dans la fonction JS*/
			{
?>
<script type="text/javascript">
			document.getElementById(<?php echo $temp; ?>).checked = true;
</script>
<?php 			} ?>
<script type="text/javascript">
		}
</script>

Bon, j'ai un résultat : toutes les cases OUI sont cochées.

Seulement, je souhaite que les cases OUI ne soient cochées QUE lorsqu'on clique sur le bouton.

Comment faire ?

De plus, j'aimerais aussi ajouter un bouton qui sélectionne, cette fois-ci, les radios "NON" et pas seulement les "OUI".

Là aussi, je coince.

Je vous remercie d'avance pour le temps que vous m'accordez.

Golmote

11 juin 2010 à 4:20:53

Ne répartis pas ton JS entre plusieurs <script> différents

Tharqua

11 juin 2010 à 18:18:55

Ok, merci mais j'ai toujours le même problème mais maintenant, rien n'est coché et rien se coche quand on clique sur le bouton "tout sélectionner".

Voici le nouveau code entier (le php intégré dans le JS) :

<?php
$array = array(1, 2, 3, 4);
$e = 0;
 ?>
 
<form method="post" action="new32.php" id="formtest">
<?php foreach($array as $temp)
	{ ?>
	<input type="radio" name="maradio<?php echo $e; ?>" value="oui" id="<?php echo $temp; ?>"/> OUI
	<input type="radio" name="maradio<?php echo $e; ?>" value="non" id="<?php echo $temp; ?>"/> NON <br />
<?php $e++;
	} ?>

	<input type="button" id="select" onclick="select()" value="Tout sélectionner"/>
</form>

<script type="text/javascript">

	function select()
			{

<?php
			foreach($array as $temp)
			{?>

			document.getElementById(<?php echo $temp; ?>).checked = true;

<?php 			}?>

			}
</script>

Merci de votre aide.

Nicolas M.

11 juin 2010 à 18:47:28

Les id ne peuvent pas commencer par un chiffre

Tharqua

11 juin 2010 à 19:22:18

J'ai essayé avec

<?php $array = array('a', 'b', 'c', 'd'); ?>

mais niet, ça ne marche pas...

J'ai utilisé différentes méthodes, essayé d'adapter des scripts de checkbox (que je n'ai pas publier puisque le résultat est le même) mais je bloque encore et toujours...

Merci encore de votre aide.

Golmote

11 juin 2010 à 21:29:18

Montre le code généré par le PHP (clic droit -> Afficher la source).

Tharqua

12 juin 2010 à 12:25:04

Ah oui, tient, c'est bizarre: j'ai deux fonctions select alors qu'il n'y a aucune ligne de code pour en faire deux... o_O

<form method="post" action="new32.php" id="formtest"> 
	<input type="radio" name="maradio0" value="oui" id="a"/> OUI
	<input type="radio" name="maradio0" value="non" id="a"/> NON <br /> 
	<input type="radio" name="maradio1" value="oui" id="b"/> OUI
	<input type="radio" name="maradio1" value="non" id="b"/> NON <br /> 
	<input type="radio" name="maradio2" value="oui" id="c"/> OUI
	<input type="radio" name="maradio2" value="non" id="c"/> NON <br /> 
	<input type="radio" name="maradio3" value="oui" id="d"/> OUI
	<input type="radio" name="maradio3" value="non" id="d"/> NON <br /> 
 
	<input type="button" id="select" onclick="select()" value="Tout sélectionner"/> 
</form> 
 
 
<script type="text/javascript"> 
	function select()
			{
				document.getElementById(a).checked = true;
				document.getElementById(b).checked = true;
				document.getElementById(c).checked = true;
				document.getElementById(d).checked = true;
			}
</script> 
	function select()
			{
				document.getElementById(a).checked = true;
				document.getElementById(b).checked = true;
				document.getElementById(c).checked = true;
				document.getElementById(d).checked = true;
			}
</script>

Et voici le code PHP :

<?php
$array = array('a', 'b', 'c', 'd');
$e = 0;
 ?>
 
<form method="post" action="new32.php" id="formtest">
<?php foreach($array as $temp)
	{ ?>
	<input type="radio" name="maradio<?php echo $e; ?>" value="oui" id="<?php echo $temp; ?>"/> OUI
	<input type="radio" name="maradio<?php echo $e; ?>" value="non" id="<?php echo $temp; ?>"/> NON <br />
<?php $e++;
	} ?>

	<input type="button" id="select" onclick="select()" value="Tout sélectionner"/>
</form>


<script type="text/javascript">
	function select()
			{
<?php
			foreach($array as $temp)
				{?>
				document.getElementById(<?php echo $temp; ?>).checked = true;
<?php 			        }?>
			}
</script>

Golmote

12 juin 2010 à 16:18:56

Bon... sans parler du doublon que je ne comprends pas bien, il te faut des guillemets autour de a, b, c et d puisque ce sont des id.

Donc

document.getElementById('<?php echo $temp; ?>').checked = true;

Tharqua

4 juillet 2010 à 12:05:40

Toujours même problème.

Si vous auriez une solution au moins pour cocher tous les boutons radios d'un formulaire (en oubliant mes problèmes ci-dessus), j'aurais une piste et je l'adapterai moi-même en tous cas.

Merci d'avance !

miclebowski

4 juillet 2010 à 13:29:58

Salut,

essaye de changer le nom de la fonction de select() en selection() par exemple.

Tharqua

4 juillet 2010 à 18:15:08

ça marche déjà mieux : dès qu'on clique sur le bouton, les oui sont cochés.

Tu m'as éclairé la voie, merci à toi ! En effet, c'était stupide de rester bloqué juste à cause du nom d'une fonction XD

J'ai améliorer tout cela et voila ce que ça donne :

<?php
$array = array('a', 'b', 'c', 'd');
$e = 0;
 ?>
 
<form method="post" action="new32.php" id="formtest">
<?php foreach($array as $temp)
	{ ?>
	<input type="radio" name="maradio<?php echo $e; ?>" value="oui" id="<?php echo $temp;?>_a"/> OUI
	<input type="radio" name="maradio<?php echo $e; ?>" value="non" id="<?php echo $temp;?>_b"/> NON <br />
<?php $e++;
	} ?>

	<input type="button" id="select" onclick="selection()" value="sélectionner oui"/>
	<input type="button" id="select" onclick="selection2()" value="sélectionner non"/>
</form>


<script type="text/javascript">
	function selection()
			{
<?php
			foreach($array as $temp)
				{?>
				document.getElementById('<?php echo $temp; ?>_a').checked = true;
<?php 			}?>
			}
			
	function selection2()
			{
<?php
			foreach($array as $temp)
				{?>
				document.getElementById('<?php echo $temp; ?>_b').checked = true;
<?php 			}?>
			}			
</script>

Mais j'ai toujours ce problème de doublon (code source de la page sur le navigateur) :

<form method="post" action="new32.php" id="formtest"> 
	<input type="radio" name="maradio0" value="oui" id="a_a"/> OUI
	<input type="radio" name="maradio0" value="non" id="a_b"/> NON <br /> 
	<input type="radio" name="maradio1" value="oui" id="b_a"/> OUI
	<input type="radio" name="maradio1" value="non" id="b_b"/> NON <br /> 
	<input type="radio" name="maradio2" value="oui" id="c_a"/> OUI
	<input type="radio" name="maradio2" value="non" id="c_b"/> NON <br /> 
	<input type="radio" name="maradio3" value="oui" id="d_a"/> OUI
	<input type="radio" name="maradio3" value="non" id="d_b"/> NON <br /> 
 
	<input type="button" id="select" onclick="selection()" value="sélectionner oui"/> 
	<input type="button" id="select" onclick="selection2()" value="sélectionner non"/> 
</form> 
 
 
<script type="text/javascript"> 
	function selection()
			{
				document.getElementById('a_a').checked = true;
				document.getElementById('b_a').checked = true;
				document.getElementById('c_a').checked = true;
				document.getElementById('d_a').checked = true;
			}
			
	function selection2()
			{
				document.getElementById('a_b').checked = true;
				document.getElementById('b_b').checked = true;
				document.getElementById('c_b').checked = true;
				document.getElementById('d_b').checked = true;
			}			
</script> 
	function selection()
			{
				document.getElementById('a_a').checked = true;
				document.getElementById('b_a').checked = true;
				document.getElementById('c_a').checked = true;
				document.getElementById('d_a').checked = true;
			}
			
	function selection2()
			{
				document.getElementById('a_b').checked = true;
				document.getElementById('b_b').checked = true;
				document.getElementById('c_b').checked = true;
				document.getElementById('d_b').checked = true;
			}			
</script>

Vous penseriez que cela est dû à quoi ?

Encore merci de ta et de vos futurs réponses !

miclebowski

5 juillet 2010 à 9:37:09

Hey, cool si j'ai pu t'aider ;). En revanche ton problème de doublon est inexplicable, j'ai teste ton code dans un nouveau fichier, ca ne m'a bien généré qu'une fonction. Bizarre...

Tharqua

6 juillet 2010 à 12:29:52

Cela peut-il provenir du serveur ou de l'emplacement (ce qui serait étonnant) ?

Au pire, ce n'est pas très grave, je ferais avec. Encore merci^^