Définir nombre radio à cocher

**vik93** · 01/08/2013, 14h27

Bonjour à tous !

Aujourd'hui, je suis confronté à un problème particulier. En effet, j'ai une liste d'éléments avec des radio button (input type = radio).

C'est une liste qui comporte plus de 200 éléments avec des radio button, et moi je souhaiterai créer quelque chose qui permet de :

1.Définir le nombre de Radio à cocher (ex : 50)

2.Une fois la première tâche effectuée, on clique sur un bouton et les radio se cochent (côté utilisateur, sans rafraichissement de la page) (ex : les 50 premiers sont cochés).

J'ai cherché un peu partout sur le net, je n'ai rien trouvé...

En espérant avoir une aide ou une piste, ce serait génial pour mon projet !

En vous remerciant d'avance.

Edit : le sujet a été déplacé, donc je précise que c'est pour du PHP

**callo** · 01/08/2013, 14h55

Bonjour,
Cela fait un bail que je n'ai plus écrit du code php. Mais si tu as par exemple

Code php :

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
<?php
echo "<table border='0'>
  <tr>
	<td>N° ordre</td>
	<td>Entete 01</td>
	<td>Entete 02</td>
	<td>Entete 03</td>
	<td>Entete 04</td>
  </tr>";
for($i=0;$i<4;$i++){
echo " <tr>
	<td>$i</td>
	<td><input type='radio' name='monradio[$i]' value='biscuit'/></td>
	<td><input type='radio' name='monradio[$i]' value='bonbon' /></td>
	<td><input type='radio' name='monradio[$i]' value='yaourt' /></td>
	<td><input type='radio' name='monradio[$i]' value='bic' /></td>
  </tr>";
  }
echo " </table>";
?>

Tu peux sur clic de ton bouton utiliser javascript pour cocher automatiquement tes radio boutons:

Code :

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

1
2
3
4
5
6
<SCRIPT LANGUAGE="JavaScript">
for($i=0;$i<4;$i++){
{
 document.forms["nomdemonform"].monradio[i].checked = true;
}
</SCRIPT>

**vik93** · 01/08/2013, 15h08

Salut et merci pour ta réponse !

N'ayant jamais fait de javascript, je comprends quand même le C++.

Code :

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

1
2
3
4
5
6
<SCRIPT LANGUAGE="JavaScript">
for($i=0;$i<4;$i++){
{
 document.forms["nomdemonform"].monradio[i].checked = true;
}
</SCRIPT>

Donc je comprends bien, le 4 correspond au nombre de cases à cocher (ce qui est parfait si j'utilise une variable !).

Cependant, où se trouve ce fameux bouton ? l'as-tu inclus dans ton code ci dessus ? Je suppose qu'en javascript il doit y avoir une syntaxe particulière

**Matthieu2000** · 01/08/2013, 15h13

Code :

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

formulaire dynamique ajax

**vik93** · 01/08/2013, 15h24

J'ai cherché, mais je n'ai pas trouvé surtout que je ne connais pas trop javascript ajax

Mais l'exemple du dessus est très parlant ! Juste trouver comment créer ce bouton ensuite j'essaye de manipuler ça.

**callo** · 01/08/2013, 15h44

Bah! c'est tout simple. Dans ton formulaire, tu mets:

Code :

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

1
2
 
<input type="button" name="Cocher" value="Cliquez pour cocher" onclick="CocherMesRadio();" />

Puis en tu écris ta fonctions javascript comme suit:

Code :

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

1
2
3
4
5
6
7
8
9
 
<script type="text/javascript">
function CocherMesRadio() {
for($i=0;$i<4;$i++){
{
 document.forms["nomdemonform"].monradio[i].checked = true;
}
}
</script>

**JérémieL** · 01/08/2013, 15h47

Bonjour,

Tu veux cocher plusieurs boutons radio d'un même groupe en même temps ? Dans un groupe de boutons radio, un seul bouton radio est coché, et en cocher un, décoche tous les autres. Sinon, ce sont des checkboxes qu'il faut que tu utilises.

Pour répondre à ta dernière question, il faut que tu ajoutes un bouton dans ton code HTML. À la fin du chargement de la page, tu vas ajouter (en javascript) un handler d'événement "click" sur le bouton qui appellera la fonction de coche des n premières cases.

Par exemple :

Code html :

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
<!DOCTYPE html>
<html>
<head>
 
<script>
//<!--
 
function checkBoxes() {
 
  var nbCheckBoxes = 2;
  
  var allInputs = document.getElementsByTagName('input');
  for (i = 0; i < allInputs.length && i < nbCheckBoxes; i++) {
    if (allInputs[i].type == 'checkbox') {
      allInputs[i].checked = true;
    }
  }
}
 
window.onload = function() {
 
  document.getElementById("checkButton").addEventListener("click", checkBoxes, false);
};
 
//-->
</script>
 
 
</head>
 
<body>
  <form id="myForm" name="myForm">
    <button type="button" id="checkButton">Cocher les 2 premières cases</button>
    <input type="checkbox" value="value1" />
    <input type="checkbox" value="value2" />
    <input type="checkbox" value="value3" />
    <input type="checkbox" value="value4" />
    <input type="checkbox" value="value5" />
  </form>
</body>
</html>

EDIT : la méthode de Callo fonctionne aussi, personnellement je préfère juste séparer les appels au javascript et la structure HTML.

**vik93** · 01/08/2013, 16h38

Merci à vous ! Je ferai des tests, et vous tiendrai au courant !!!

**vik93** · 06/08/2013, 11h14

Juste une question, ton formulaire permet de cocher deux cases. Mais si ce nombre de case je souhaite le définir (par une liste déroulante par exemple, avec la possibilité de choisir un nombre entre 1 et 100), comment puis-je faire ?

Exemple :

Code html :

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

1
2
3
4
5
6
7
8
<select name="nombre">
<option value="1"> 1 </option>
<option value="2"> 2 </option>
<option value="3"> 3 </option>
<option value="23">4 </option>
</select>
 
<button type="button" id="checkButton">

Il faut que je mette en relation le bouton avec la liste déroulante, comment puis-je faire ?
(Veuillez m'excuser d'avance si cette fonctionnalité vous parait simple, je ne suis pas un expert en javascript loin de la)

En vous remerciant d'avance.

Définir nombre radio à cocher

JavaScript

Vue hybride

Discussions similaires

Partager

Partager