Griser / Désactiver un élément

**gege765** · 14/01/2012, 17h27

Bonjour,

Voilà j'ai un formulaire de recherche contenant deux éléments;

J'aimerais que seul un des deux éléments soit complété, soit le nom ou l'adresse.

Est-il possible en javascript ou par une autre méthode de désactiver un élément si l'autre a été complété sans passé par un bouton radio comme je le fais actuellement ?

Existe t'il une méthode plu simple ?

Voici 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
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
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Recherche</title>
		<script type="text/javascript">
			function grise(radio) {
				if(radio[0].checked){
					document.choix.ip.disabled=true
					document.choix.nom.disabled=false
 
				} 
				if(radio[1].checked){
					document.choix.ip.disabled=false
					document.choix.nom.disabled=true
				}
			} 
		</script> 
	</head>
	<body>	
		<form action='traitementReqPerso.php' name='choix' class='cmxform' id='frm_rech' method='post'>
			<fieldset>
				<legend>Recherche rapide par nom ou adresse </legend>
				<p>
					<input type="radio" name="choixRech" value="Nom" onclick="grise(this.form.choixRech)">
					<label for='nom'>Nom</label>
					<select name='nom' id='nom'>
						<option value=''>Choisir un Nom</option>
						<option value='2510'>2510</option>
						<option value='2610'>2610</option>
						<option value='2510'>2512</option>
						<option value='2510'>2524</option>
						<option value='2510'>2312</option>
						<option value='2510'>2324</option>
					</select>
				</p>
				<p>
					<input type="radio" name="choixRech" value="ip" onclick="grise(this.form.choixRech)">
					<label for='ip'>Adresse IP</label>
					<input type='text' name='ip' value=''>
				</p>
				<p>
					<input class='submit' type='submit' value='Afficher'>
				</p>
			</fieldset>
		</form>
	</body>
</html>

**NoSmoking** · 15/01/2012, 10h39

Bonjour,
ergonomiquement parlant cela me paraît moyen que de désactiver un champ quand l'autre est renseigné, comment fait-on lorsque l'on décide de changer d'avis, l'autre champ étant disabled il devient inaccessible!

**gege765** · 15/01/2012, 11h55

Bonjour,

Merci de ton aide.

Si l'utilisateur change d'avis, il re-sélectionne le bouton radio est dans ce cas le champs n'est plus grisé.

Quel solution alternative existe t'il à cela ?

**Bovino** · 15/01/2012, 12h01

La réponse de NoSmoking concernait ta demande :

Est-il possible en javascript ou par une autre méthode de désactiver un élément si l'autre a été complété sans passé par un bouton radio comme je le fais actuellement ?

et je rejoins d'ailleurs son avis !

Sinon, tu peux simplifier ta fonction :

Code :

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

1
2
3
4
function grise(radio) {
    document.choix.ip.disabled=radio[1].checked;
    document.choix.nom.disabled=radio[0].checked;
}

**gege765** · 15/01/2012, 12h49

Désolé.
Je pense que je n'étais pas totalement réveillé.

Merci pour la simplification de la fonction.
D'ailleurs il y avait une petite erreur.

Code :

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

1
2
3
4
function grise(radio) {
	document.choix.ip.disabled=radio[0].checked;
	document.choix.nom.disabled=radio[1].checked;
}

Autre chose au chargement de la page comment faire pour désactiver un des élément.

j'ai ajouté

Code :

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

<input type="radio" name="choixRech" value="Nom" checked='checked' onclick="grise(this.form.choixRech)">

Le problème est je pense lié au faite que l’évènement javascript est onclick est donc il ne se passe rien au chargement de la page.

Quel serait la solution pour qu'un des élément soit grisé au chargement de la page ?

**Bovino** · 15/01/2012, 13h59

Envoyé par gege765

D'ailleurs il y avait une petite erreur.

Bah... non...
Si le radio est coché, sa propriété checked vaut true or tu veux que le champ associé soit activé, donc que sa propriété disabled soit false

Envoyé par gege765

Autre chose au chargement de la page comment faire pour désactiver un des élément.

sur le onload du body par exemple

Code html :

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

<body onload="grise(document.getElementsByName('choixRech')">

**gege765** · 15/01/2012, 14h39

Envoyé par Bovino

Bah... non...
Si le radio est coché, sa propriété checked vaut true or tu veux que le champ associé soit activé, donc que sa propriété disabled soit false

Pourtant lorsque j'ai testé justement je n'obtenais pas le résultat attendu.
Or en inversant cela fonctionne.

Sinon pour le <body onload="grise(document.getElementsByName('choixRech'))"> c'est OK

Griser / Désactiver un élément

JavaScript

Discussions similaires

Partager

Partager