Fermer

Visiteur non-identifié | Identifiez-vous | Devenir membre
Code perdu ? | Combien de visiteurs sur votre site ?

Activer/Afficher un champ en fonction de checkbox ou radio

Script posté par :

EricM
Vous aussi, postez vos scripts en cliquant ici.

Description

Ce script permet d'activer/désactiver ou d'afficher/masquer un objet (texte, liste, div etc...) suivant si un radio ou une checkbox donnés est cochée.
Les paramètres sont :
- L'id de l'objet (radio ou checkbox) qui controle
- L'id de l'objet (input, select...) qui est controlé
- L'indicateur de masquage : si '1', le "contrôlé" sera masqué, sinon il sera désactivé
Compatible FF.

Compatibilité :

	FireFox : Toutes versions
	Mozilla : 1 et +
	Netscape Navigator : 6 et +
	Internet Explorer : 5 et +

Ce script utilise le DHTML

Chiffres :

Date de création : 9/12/2005
Dernière modif : -
Visites de la page : 59484
Envois par mail : 1128

Exemple :

Exemples de désactivations :

Contrôle de "texte_1"

Active de "liste_1"
Désactive de "liste_1"

Exemples de masquage :

Contrôle de "texte_10"

Active de "liste_10"
Désactive de "liste_10"

Le code :

Entre <HEAD> et </HEAD> :

Entre <BODY> et </BODY> :

Exemples de désactivations :<br /><br />
<input type="checkbox" id="chkb_1" onClick="GereControle('chkb_1', 'texte_1', '0');" CHECKED>&nbsp;<label for="chkb_1">Contrôle de "texte_1"</label>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" id="texte_1" value="Contenu de texte_1">

<br /><br />
<input type="radio" id="radio_1" name="radios" onClick="GereControle('radio_1', 'liste_1', '0');" CHECKED>&nbsp;<label for="radio_1">Active de "liste_1"</label>
<br />
<input type="radio" id="radio_2" name="radios" onClick="GereControle('radio_1', 'liste_1', '0');">&nbsp;<label for="radio_2">Désactive de "liste_1"</label>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<select id="liste_1">
	<option value="1">Ligne 1</option>
	<option value="2">Ligne 2</option>
	<option value="3">Ligne 3</option>
</select>

<br /><br /><br /><br />
Exemples de masquage :<br /><br />

<input type="checkbox" id="chkb_10" onClick="GereControle('chkb_10', 'texte_10', '1');" CHECKED>&nbsp;<label for="chkb_10">Contrôle de "texte_10"</label>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" id="texte_10" value="Contenu de texte_10">

<br /><br />
<input type="radio" id="radio_10" name="radios_0" onClick="GereControle('radio_10', 'liste_10', '1');" CHECKED>&nbsp;<label for="radio_10">Active de "liste_10"</label>
<br />
<input type="radio" id="radio_20" name="radios_0" onClick="GereControle('radio_10', 'liste_10', '1');">&nbsp;<label for="radio_20">Désactive de "liste_10"</label>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<select id="liste_10">
	<option value="1">Ligne 1</option>
	<option value="2">Ligne 2</option>
	<option value="3">Ligne 3</option>
</select>

Services email :

Je désire recevoir ce script par email
Je désire recevoir un email en cas de modification de ce script
Je désire m'abonner à la newsletter de l'éditeur JavaScript

Les annotations des visiteurs :

De EricM - le 04-04-2006

Suite à plusieurs questions d'utilisateurs, voici la manière de cacher ou masquer un champ au chargement de la page (il sont affichés / activés dans le script original):

Enlever la proriété CHECKED de la checkbox concernée et appeler la fonction de contrôle sur l'évènement onload du tag <body> (déclenché au chargement de la page)

<body onload="GereControle('chkb_1', 'texte_1', '1');">

le CHECKED que vous avez enlevé sera alors pris en compte à l'ouverture.

De rarapetou - le 27-01-2007

bonjour,

pouvez vous donner un exemple sur 3 radio différente.

J'arrive à en faire une mais des que j'en rajoute ca crée des conflis!

(radio qui efface et affiche, pas de grisé)

Merci d'avance

Rémi

De darlinho27 - le 08-05-2008

comment faire pour afficher/masquer plusieurs objets (texte, liste, div etc...) suivant si un radio ou une checkbox donnés est cochée.

De Tuttu - le 21-11-2008

Bonjour et merci pour ce super script !

Aujourd'hui je cherche à l'utiliser sur des class et non pas des Id mais je bloque un peu.

Vous qui avez fait le code, pensez-vous que ça soit faisable ou faut-il écrire un code complètement nouveau ?

De hypsilum - le 15-12-2009

Bonjour tout le monde,

J'ai une petite question par rapport à la méthode ( rajouter onload="GereControle('chkb_1', 'texte_1', '1')"; dans le <body> de la page) pour que la fonction qui fait disparaitre les <input type="text"> soit prise en compte au chargement de la page.

Ma question est la suivante, en fait sur mon formulaire, j'ai aussi, un calendrier qui s'affiche dans une <div> quand on click dessus et quand je met les fonctions onload="GereControle('chkb_1', 'texte_1', '1')"; dans la balise <body>, l'affichage de se calendrier, ne se fait plus...

J'ai fait quelques différents test, sans résultats...
Est-ce que quelqu'un aurais été confronté à se même problème? On ne sait jamais...

Bonne journée tout le monde
Hypsilum

De diice - le 19-04-2010

bonjour,

tout d'abord merci pour ce script.

Ensuite je voulais savoir comment faire avec plusieurs chekbox 'radio' ?

exemple :
j'ai 4 choix (radio), et je voudrais que le 4eme fasse apparaitre le champs texte ? (comme "autre : precisez..." + champs texte)

<input type="radio" name="votrebien" id="votrebien0" onClick="GereControle('votrebien', 'autrebien', '1');" value="Maison" class="form" /><br /> <br /> <label for="Appartement">Appartement</label> <input type="radio" name="votrebien" id="votrebien1" onClick="GereControle('votrebien', 'autrebien', '1');" value="Appartement" class="form" /><br /> <br /> <label for="Local_commercial">Local commercial</label> <input type="radio" name="votrebien" id="votrebien2" onClick="GereControle('votrebien', 'autrebien', '1');" value="Local commercial" class="form" /><br /> <br /> <label for="autrebien">Autre, précisez :</label> <input type="radio" name="votrebien" id="votrebien3" onClick="GereControle('votrebien', 'autrebien', '1');" value="bienautre" class="form" checked /> <input type="text" name="autrebien" value="precisez" onFocus="this.value=''" size="26" maxlength="100" class="form" />

merci d'avance...

>> Poster une annotation sur ce script

compteur gratuit
actuellement en ligne

PUBLICITE

ANNUAIRE WEBMAST.

CibleClick
La plate-forme d'affiliations toujours au top. De nombreux programmes, pour tous les gouts. Serieux dans les paiements.
http://www.cibleclick.com

Cat : Affiliation - publicité
Voir l'annuaire webmaster

LES SCRIPTS :

78 à éditer
68 à copier/coller
247 des membres
2580 sur le web
>> Tous les scripts

LES MEMBRES :

65973 membres
4642 comptes CountUs
1842 comptes myCircle

LES FORUMS :

14 forums
40359 topics
191688 messages
>> Les forums

SONDAGE

La mini-astuce "Referencement" du jour par krucial
Pour savoir combien de pages de votre site sont indexées dans Google, il vous suffit de taper, dans la boite de recherche du moteur : "site:http://www.votresite.com";.
Proposer votre mini-astuce | Archives des mini-astuces

Pseudo :
Code :
	Se souvenir de moi