Griser et dégriser un champ en fonction d'une case cochée

**nickoeuh** · 19/06/2008, 10h17

Bonjour.

Je viens à vous car j'ai encore des soucis de JS au boulot.
Je crois que je ne vais pas avoir le choix et me mettre à l'étudier sérieusement, mais actuellement je n'ai pas le temps, le client n'attendra pas que j'pige pour recevoir son backoff.

Voilà mon problème :

J'ai un formulaire qui doit réagir instantanément... Ajax ?
Bref, de base j'ai une checkbox qui est cochée.
A coté de cette checkbox j'ai un input. J'aimerais que lorsque la checkbox est cochée, l'input soit grisé et lorsqu'elle est décochée, il ne soit plus grisé.

On voit ça parfois mais je n'ai aucune idée de comment réaliser une telle action.

Je m'en remets donc à votre bon coeur.

Naturellement j'étudierai la proposition afin d'en comprendre le principe.

Merci d'avance.

**tusssss** · 19/06/2008, 10h29

Il suffit de changer la couleur en gris et de la passer en readOnly, ca c'est pour quelque chose de certain, je ne sais pas ce qui se passe quand on passe un champ text en disabled, ca fait peut être cela tout seul...

Je vais tester de ce pas....

**tusssss** · 19/06/2008, 10h35

Ça a l'air de plutôt pas mal fonctionner.

Si ton input text à un id ça sera facile.

Après avoir testé si la checkbox est cochée ou non,

Il suffit donc de récupérer le input de cette manière et de le griser comme ceci:

Code :

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

document.getElementById('ton_id_champ_input').disabled=true;

**nickoeuh** · 19/06/2008, 11h11

Je te remercie de ta réponse que j'ai lue instantanément.
Et je n'y arrive pas. Rien ne fonctionne.

Peut-etre est-ce le test, en fait j'en sais rien ^^.

Voilà mon code :

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
				<td class="lab">Prix d'exécution <?php if(isset($exe_price) != NULL || isset($exe_price) != 'pnd_exe') { ?><span class="parenthese">(<?php echo $price; ?> €) <?php } else { echo '( en € )'; } ?></span></td>
				<td class="prix">
					<input type="text" name="millier_exe" id="millier_exe" value="<?php echo $millier; ?>" class="large" maxlength="3" />
					<input type="text" name="centaine_exe" id="centaine_exe" value="<?php echo $centaine; ?>" class="large" maxlength="3" />, 
					<input type="text" name="decimale_exe" id="decimale_exe" value="<?php echo $decimal; ?>" class="large" maxlength="2" /> €<br />ou<br />
					<input type="checkbox" value="pnd_exe" name="pnd_exe" id="pnd_exe" <?php if($exe_price == pnd_exe || $exe_price == NULL) { echo 'checked="checked"'; } ?>/> PND
				</td>
 
				<script>
		if(document.forms["formulaire"].element["pnd_exe"].checked == true)
		{
		document.getElementById('millier_exe').disabled=true;
		}
 
		</script>

It does not work

**tusssss** · 19/06/2008, 11h18

Il faut que tu places ton javascript dans une fonction comme par exemple comme ceci :

Code :

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

1
2
3
4
5
6
7
8
9
<script>
function DesactiverZoneTexte()
{
	if(document.forms["formulaire"].element["pnd_exe"].checked ==true)
	{
		document.getElementById('millier_exe').disabled=true;
	}
}		
</script>

Ensuite tu places ce code entre les balises <head> et </head> de ta page.

Ensuite, dans la balise de ta checkbox, viens insérer un :

Code :

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

1
2
 
onchange="DesactiverZoneTexte();"

Ca devrait fonctionner après ca.

Bon courage

**nickoeuh** · 19/06/2008, 11h30

Ca ne fonctionne toujours pas

**nickoeuh** · 27/06/2008, 13h27

Hello.

Je reviens à vous sur un problème important.
Après avoir mis en place ce petit script, le submit ne fonctionne plus.

Si j'enlève cette partie :

Code :

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

1
2
3
4
<script>
		checkboxClick();
		checkboxClick2();
	</script>

Ca refonctionne. Moi pas comprendre

.
Si vous aviez une idée.

Merci.

Griser et dégriser un champ en fonction d'une case cochée

JavaScript

Vue hybride

Discussions similaires

Partager

Partager