Checkbox : Récupérer valeur si pas coché

**arthuro45** · 04/12/2009, 10h29

Bonjour,

cette fonction fonctionne quand je coche la case, mais quand je décoche rien ne se passe. Je veux griser un bouton en fonction de l'état du checkbox.

Code :

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

1
2
3
4
5
6
7
8
function apparait()
{
 if (document.form1.choix.checked){
	document.getElementById('valid_select').disabled=true;
	}else{
	document.getElementById('valid_select').disabled=false;
	}
}

Merci

**E.Bzz** · 04/12/2009, 10h32

Bonjour,
il faudrait voir le code HTML associé, avec l'appel de la fonction ...

A+

**andry.aime** · 04/12/2009, 11h13

Bonjour,
+1E.Bzz
Mais tu peux simplifier ton code.

Code :

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

1
2
3
4
function apparait()
{
  document.getElementById('valid_select').disabled=document.form1.choix.checked;
}

**arthuro45** · 04/12/2009, 11h49

Mais tu peux simplifier ton code.

Code :
function apparait()
{
document.getElementById('valid_select').disabled=document.form1.choix.checked;
}

Mais ça ne grise pas le bouton quand je décoche.

Le code HTML est un tableau je vous met une partie simplifiée :

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
<html>
<head>
</head>
<body>
<button type="submit" name="valid_select" id="valid_select" disabled="disabled">Valider la sélection</button>
<table id="tableau">
<thead>
<tr>
<th><input type="checkbox" name="all" id="all" onclick="selectall(document.form1.all,document.form1.choix)"><br>Tous</th>
<th>tab1</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox" name="choix" id="choix" value="1" onclick="apparait()"></td>
<td>donnee</td>
</tr>
</tbody>
</table>
</body>
</html>

**E.Bzz** · 04/12/2009, 12h01

Envoyé par arthuro45

Mais ça ne grise pas le bouton quand je décoche.

Simplifier un code est différent de corriger une erreur.
La suggestion d'Andry reste donc tout à fait valable

Envoyé par arthuro45

Le code HTML est un tableau je vous met une partie simplifiée

Sauf dans les cas extrêmes, mieux vaut ne pas simplifier

Ici par exemple, tu te retrouves avec un type="submit" qui n'est pas dans un form (pour nous, car je suppose que le form existe bien, mais on ne peut t'aider que sur le code que tu nous montres).
Au passage, la balise <button> est dépréciée et ne peut de toutes façons pas être de type="submit" => à remplacer par un input type="submit"!

Donc, le code complet serait préférable ...

A+

**arthuro45** · 04/12/2009, 12h57

Le code comprend du PHP, requêtes ect... pas essentiel pour le test, donc j'ai ajouté les fonctions Javascript dans le head pour l'essai et cela donne un petit tableau exploitable :

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
<html>
<head>
<script language="JavaScript">
function selectall(cas,choix){
  //test si on a plusieur ligne
  if(choix.length>0){
    if (cas.checked){
      for (var i=0; i<choix.length;i++){
        choix[i].checked=true //On coche tous
      }
	document.getElementById('valid_select').disabled=false;  
    }
    else{
      for (var i=0; i<choix.length;i++){
        choix[i].checked=false //On décoche tous
      }
	document.getElementById('valid_select').disabled=true;
    }
  }	
} 
 
function apparait()
{
 if (document.form1.choix.checked){
	document.getElementById('valid_select').disabled=true;
	}else{
	document.getElementById('valid_select').disabled=false;
	}
}   
</script>
</head>
<body>
<?php 
$self = $_SERVER['PHP_SELF'];
echo "<form method='POST' action='$self' name='form1' id='form1'>\n"; ?>
<button type="submit" name="valid_select" id="valid_select" disabled="disabled">Valider la sélection</button>
<table border="1" id="tableau">
<thead>
<tr>
<th><input type="checkbox" name="all" id="all" onclick="selectall(document.form1.all,document.form1.choix)"><br>Tous</th>
<th>col1</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox" name="choix" id="choix" value="1" onclick="apparait()"></td>
<td>donnee1</td>
</tr>
<tr>
<td><input type="checkbox" name="choix" id="choix" value="1" onclick="apparait()"></td>
<td>donnee2</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>

Checkbox : Récupérer valeur si pas coché

JavaScript

Vue hybride

Discussions similaires

Partager

Partager