Détecter un input désactivé (grisé)

**xoftob** · 26/08/2014, 18h13

Bonjour à tous,

J'aimerais bien savoir comment peut-on détecter un input que l'on a désactivé dans un traitement en js, pour qu'à la fin le cacher, voilà le code qui désactive mes inputs:

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
var e = document.getElementById("metformine");
	var elem_nbr_metformine = document.getElementById("nbr_metformine");
 
	function calcul_mgj() {
 
		var list_idx = e.options[e.selectedIndex].index;
		var elem_nb_mg = e.options[e.selectedIndex].text;
		var nb_mg = parseFloat(elem_nb_mg);
 
		var elem_dose = document.getElementById("nbr_metformine");
		var dose = parseFloat(elem_dose.value);
 
		var elem_result = document.getElementById("dose_metformine");
 
		if (elem_dose.value != ''){
			elem_result.value = parseFloat(nb_mg * dose);
		}
 
		e2.disabled=(list_idx > 0);
        elem_nbr_stagid.disabled=(list_idx > 0);
 
	}
	elem_nbr_metformine.addEventListener("blur", calcul_mgj);
	e.addEventListener("change", calcul_mgj);

Là donc, je veux que mon fichier php (qui traite le formulaire où il y a ce bout de code en js) qu'il detecte les <input> et <select> desactivés

Merci d'avance

**NoSmoking** · 26/08/2014, 18h21

Bonjour,
pourquoi ne pas les cacher quand tu les désactives

**xoftob** · 26/08/2014, 18h28

Je te remercie pour ta réponse, en fait j'ai une liste de traitement qui sont tous activé au début, mais quand je choisi un traitement en choisissant une valeur d'une des listes déroulantes, toutes les autres se désactivent ainsi que leurs inputs qui leurs correspondent, du coup, quand je fini de remplir tout mon formulaire et je valide, je veux afficher dans la page qui suit la validation, juste le traitement choisi. Dans la partie traitement, il y a 7 checkboxs qui ont l'effet du bouton radio, et que lorsque je coche une case a cocher, une div avec des listes deroulantes et champs de type number qui défile. Lors de la validation je récupère la valeur du chekbox choisi pour afficher la div qui lui correspond, sauf que cette div affiche tout ce qui a dedans

**NoSmoking** · 26/08/2014, 18h44

Tu peux utiliser la méthode querySelectorAll pour récupérer les INPUT disabled/enabled, cette méthode retourne une nodeList il te suffira donc de la parcourir.

Code :

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

1
2
var lstInputs = document.querySelectorAll("input:enabled");  // enabled par exemple
var lstInputs = document.querySelectorAll("input:disabled"); // ou disabled par exemple

**xoftob** · 26/08/2014, 20h46

Bonsoir NoSmoking,

j'ai pas réussi a récupérer les input désactivés, j'ai mis la variable lstInputs dans un message d'alert comme ci-dessous et rien mon alert ne s'affiche pas:

Code :

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

1
2
3
4
5
var lstInputs = document.querySelectorAll("input:disabled");
for (var i = 0; i < lstInputs.length; ++i) {
  var item = lstInputs[i];  
  alert(item);
}

**NoSmoking** · 26/08/2014, 22h07

Quel est ton environnement de développement, si c'est IE8 c'est normal le sélecteur doit être un sélecteur CSS2 or input:disabled est un sélecteur CSS3.

Dans ce cas il y a lieu de remplacer le input:disabled par un input[disabled] mais point de salut avec cette méthode pour IE7 !

pour test:

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
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>[querySelectorAll]</title>
</head>
<body>
  <input value="un" disabled>
  <input value="deux">
  <input value="trois">
  <input value="quatre" disabled>
<script>
var lstInputs = document.querySelectorAll('input[disabled]'); // compatible IE8
var i, nb = lstInputs.length;
for( i=0; i< nb; i++){
  lstInputs[i].style.backgroundColor = '#BCD';
}
</script>
</body>
</html>

**xoftob** · 26/08/2014, 23h37

ça marche, sauf que j'ai constaté que ce que je veux demande un peu plus de ton aide hh, en fait j'ai ma page qui comporte mon formulaire, là où il y a mes input grisé, et j'ai ma deuxieme page qui traite le formulaire lors de la validation et affiche des resultats ainsi que les traitements dont je t'ai parlé tout en haut, et dans cette deuxieme page ou je veux faire ma detection des input desactivé et les caché après, voici le code du premier formulaire:

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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<h5 style="margin-top: 20px; color: darkcyan; font-size:15px ">GLINIDES</h5><input type="checkbox" class="enableForm4" name="chek" value="check4" id="check4"/>
<div class="controlled4">
	<table>	
		<tr>
			<td>
				<label for="novonorm">Novonorm Ou Repaglinide<br>
				<select class="input" id="novonorm" name="novonorm" style="width:130px"> 
				   <option>choisissez...</option>
				   <option value="0.5">0.5</option>
				   <option value="1">1</option>
				   <option value="2">2</option>
				</select></label> (mg)
			</td>
			<td>
				<label for="nbr_novonorm">Nombre de comprimé(s)/jour<br>
				<input type="number" min="1" max="4" step="1" tabindex="10" size="20" value="" class="input" id="nbr_novonorm" name="nbr_novonorm"></label> (c/j)
			</td>
			<td>
				<label for="dose_novonorm">Dose totale<br>
				<input type="text" tabindex="10" size="20" value="---" class="input" id="dose_novonorm" name="dose_novonorm" readonly></label> (mg/j)
			</td>
		</tr>
	</table>
		</div>
				<h5 style="margin-top: 20px; color: darkcyan; font-size:15px ">INHIBITEUR DES ΑLPHA-GLUCOSIDASES</h5><input type="checkbox" class="enableForm5" name="chek" value="check5" id="check5"/>
		<div class="controlled5">
	<table>	
		<tr>
			<td>
				<label for="glucor">Glucor Ou Acarbose<br>
				<select class="input" id="glucor" name="glucor" style="width:130px">
				   <option>choisissez...</option> 
				   <option value="50">50</option>
				   <option value="100">100</option>
				</select></label> (mg)
			</td>
			<td>
				<label for="nbr_glucor">Nombre de comprimé(s)/jour<br>
				<input type="number" min="1" max="4" step="1" tabindex="10" size="20" value="" class="input" id="nbr_glucor" name="nbr_glucor"></label> (c/j)
			</td>
			<td>
				<label for="dose_glucor">Dose totale<br>
				<input type="text" tabindex="10" size="20" value="---" class="input" id="dose_glucor" name="dose_glucor" readonly></label> (mg/j)
			</td>
		</tr>
		<tr>
			<td>
				<label for="diastabose">Diastabose<br>
				<select class="input" id="diastabose" name="diastabose" style="width:130px"> 
				   <option>choisissez...</option>
				   <option value="50">50</option>
				   <option value="100">100</option>
				</select></label> (mg)
			</td>
			<td>
				<label for="nbr_diastabose">Nombre de comprimé(s)/jour<br>
				<input type="number" min="1" max="4" step="1" tabindex="10" size="20" value="" class="input" id="nbr_diastabose" name="nbr_diastabose"></label> (c/j)
			</td>
			<td>
				<label for="dose_diastabose">Dose totale<br>
				<input type="text" tabindex="10" size="20" value="---" class="input" id="dose_diastabose" name="dose_diastabose" readonly></label> (mg/j)
			</td>
		</tr>
	</table>
		</div>

voici le code js qui permet de desactiver les inputs:

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
var e6 = document.getElementById("glucor");
var elem_nbr_glucor = document.getElementById("nbr_glucor");
function calcul_mgj6() {
	var list_idx = e6.options[e6.selectedIndex].index;
	var elem_nb_mg = e6.options[e6.selectedIndex].text;
	var nb_mg = parseFloat(elem_nb_mg);
	var elem_dose = document.getElementById("nbr_glucor");
	var dose = parseFloat(elem_dose.value);
	var elem_result = document.getElementById("dose_glucor");
	if (elem_dose.value != ''){
		elem_result.value = parseFloat(nb_mg * dose);
	}
	e7.disabled=(list_idx > 0);
        elem_nbr_diastabose.disabled=(list_idx > 0);
}
elem_nbr_glucor.addEventListener("blur", calcul_mgj6);
e6.addEventListener("change", calcul_mgj6);
var e7 = document.getElementById("diastabose");
var elem_nbr_diastabose = document.getElementById("nbr_diastabose");
function calcul_mgj7() {
	var list_idx = e7.options[e7.selectedIndex].index;
	var elem_nb_mg = e7.options[e7.selectedIndex].text;
	var nb_mg = parseFloat(elem_nb_mg);
	var elem_dose = document.getElementById("nbr_diastabose");
	var dose = parseFloat(elem_dose.value);
	var elem_result = document.getElementById("dose_diastabose");
	if (elem_dose.value != ''){
		elem_result.value = parseFloat(nb_mg * dose);
	}
	e6.disabled=(list_idx > 0);
        elem_nbr_glucor.disabled=(list_idx > 0);
}
elem_nbr_diastabose.addEventListener("blur", calcul_mgj7);
e7.addEventListener("change", calcul_mgj7);
.....

Et voici la recuperation dans la deuxieme page:

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
<div id="contphp5" style="display:none">
	<table>	
		<tr>
			<td>
				<h5 style="margin-top: 20px; color: darkcyan; font-size:15px ">INHIBITEUR DES ΑLPHA-GLUCOSIDASES</h5>
			</td>
		</tr>
		<tr>
			<td>
				<label id="glucor">Glucor Ou Acarbose<br>
				<?php echo $glucor; ?> mg
			</td>
			<td>
				<label id="nbr_glucor">Nombre de comprimé(s)/jour<br>
				<?php echo $nbr_glucor; ?> c/j
			</td>
			<td>
				<label id="dose_glucor">Dose totale<br>
				<?php echo $dose_glucor; ?> mg/j
			</td>
		</tr>
		<tr>
			<td>
				<label id="diastabose">Diastabose<br>
				<?php echo $diastabose; ?> mg
			</td>
			<td>
				<label id="nbr_diastabose">Nombre de comprimé(s)/jour<br>
				<?php echo $nbr_diastabose; ?> c/j
			</td>
			<td>
				<label id="dose_diastabose">Dose totale<br>
				<?php echo $dose_diastabose; ?> mg/j
			</td>
		</tr>
	</table>
</div>

Et voici le js de cette page:

Code :

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

1
2
3
4
5
6
7
8
function AfficherCacher() {
	var chek = <?php echo '"'.$chek.'"'; ?>;
	var lstInputs = document.querySelectorAll('input[disabled]'); 
	var i, nb = lstInputs.length;
	for( i=0; i< nb; i++){
  		aa = lstInputs[i].id;
		alert(aa);
	}	//.....

**BakSh0** · 27/08/2014, 10h02

Bonjour,

Code php :

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

1
2
3
4
5
6
7
8
9
10
<?php
if (!empty($nbr_glucor)) {
?>
 
<td>
  <label id="nbr_glucor">Nombre de comprimé(s)/jour</label>
  <br /> <?php echo $nbr_glucor; ?> c/j
</td>
 
<?php } ?>