Créer des cases à cocher mutuellement exclusives

Date de publication : 03 mai 2009 , Date de mise à jour : 03 mai 2009

Par Christian Wenz
 Philippe Vialatte (Traduction) (ma page DVP) (Blog)
 

Quand une seule option d'une série doit être sélectionnée, les boutons radio sont généralement utilisés. Il y a un inconvénient, cependant : une fois qu'un bouton radio d'un groupe est sélectionné, il n'est pas possible de désélectionner tous les boutons radio. Les cases à cocher peuvent être désactivées à tout moment, mais ne sont pas mutuellement exclusives. Ce tutoriel présente la meilleure des deux approches: des cases à cocher qui sont mutuellement exclusives.
Voir une démo
Téléchargez le code de ce tutoriel

               Version PDF (Miroir)   Version hors-ligne (Miroir)

Traduction
Étapes


Traduction

Cet article est la traduction la plus fidèle possible de l'article original : en  Creating Mutually Exclusive Checkboxes


Étapes

L'ASP.NET AJAX Control Toolkit contient l'extension MutuallyExclusiveCheckBox. Cela permet aux programmeurs d'assigner à une case à cocher un nom de groupe (attribut Key). De toutes les cases à cocher d'un même groupe, une seule peut être sélectionnée à la fois.

Commençons par mettre deux cases à cocher sur une nouvelle page ASP.NET. Il pourrait y'en avoir plus, mais deux d'entre elles suffisent à démontrer le principe : 

<asp:CheckBox ID="cbYes" runat="server" />Yes 
<asp:CheckBox ID="cbNo" runat="server" />No
Pour les deux cases à cocher, un contrôle MutuallyExclusiveCheckBoxExtender doit être mis sur la page. Les deux attributs Key doivent avoir la même valeur, de la même façon que les attributs name d'un ensemble de boutons radio doivent être identiques pour désigner le groupe auquel ils appartiennent. La propriété TargetControlID de l'extension doit pointer vers l'ID de la case à cocher. 

<ajaxToolkit:MutuallyExclusiveCheckBoxExtender ID="mecbe1" runat="server"      
	TargetControlID="cbYes" Key="YesNo" /> 
<ajaxToolkit:MutuallyExclusiveCheckBoxExtender ID="mecbe2" runat="server"      
	TargetControlID="cbNo" Key="YesNo" />
Enfin, il faut inclure le ScriptManager d'ASP.NET AJAX, qui est requis par tous les éléments de l'ASP.NET AJAX Control Toolkit : 

<asp:ScriptManager ID="asm" runat="server" />
Enregistrez et exécutez la page. Vous pouvez cocher et décocher les deux cases à cocher, mais à aucun moment les deux cases à cocher ne peuvent être cochées.

Une seule case peut être cochée à la fois


               Version PDF (Miroir)   Version hors-ligne (Miroir)

Valid XHTML 1.1!Valid CSS!

Copyright © 2009 Equipe Dotnet. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. Droits de diffusion permanents accordés à Developpez LLC. Cette page est déposée.

 
 
Developpez.com

Nous contacter

Participez

Informations légales

 
Services

Forum Microsoft DotNET

Blogs

Hébergement

 
Partenaires

Hébergement Web