Creazione di caselle di controllo che si escludono a vicenda (VB)

di Christian Wenz

Scarica il PDF

Quando è possibile selezionare solo un set di opzioni, i pulsanti di opzione vengono in genere usati. Tuttavia, esiste uno svantaggio: una volta selezionato un pulsante di opzione in un gruppo, non è possibile deselezionare tutti i pulsanti di opzione. Le caselle di controllo possono essere deselezionate in qualsiasi momento, ma non si escludono a vicenda. Questa esercitazione offre le migliori opzioni di entrambi gli approcci: caselle di controllo che si escludono a vicenda.

Panoramica

Quando è possibile selezionare solo un set di opzioni, i pulsanti di opzione vengono in genere usati. Tuttavia, esiste uno svantaggio: una volta selezionato un pulsante di opzione in un gruppo, non è possibile deselezionare tutti i pulsanti di opzione. Le caselle di controllo possono essere deselezionate in qualsiasi momento, ma non si escludono a vicenda. Questa esercitazione offre le migliori opzioni di entrambi gli approcci: caselle di controllo che si escludono a vicenda.

Passaggi

Il ASP.NET AJAX Control Toolkit contiene l'estensione MutuallyExclusiveCheckBox. Ciò consente ai programmatori di assegnare qualsiasi casella di controllo a un nome di gruppo (Key attributo). Da tutte le caselle di controllo all'interno dello stesso gruppo, è possibile selezionare una sola volta.

Iniziamo con l'inserimento di due caselle di controllo in una nuova pagina ASP.NET. Ci possono essere più, ma due di loro sufficienti per dimostrare il principio:

<asp:CheckBox ID="cbYes" runat="server" />Yes
<asp:CheckBox ID="cbNo" runat="server" />No

Per entrambe le caselle di controllo, è necessario inserire un controllo MutuallyExclusiveCheckBoxExtender nella pagina. Entrambi gli attributi chiave devono avere lo stesso valore, così come gli attributi di valore degli elementi del pulsante di opzione HTML devono essere identici per indicare il gruppo a cui appartengono. La proprietà TargetControlID dell'estensione punta all'ID della casella di controllo.

<ajaxToolkit:MutuallyExclusiveCheckBoxExtender ID="mecbe1" runat="server"
 TargetControlID="cbYes" Key="YesNo" />
<ajaxToolkit:MutuallyExclusiveCheckBoxExtender ID="mecbe2" runat="server"
 TargetControlID="cbNo" Key="YesNo" />

Infine, includere il ASP.NET AJAX ScriptManager richiesto da tutti gli elementi del ASP.NET AJAX Control Toolkit:

<asp:ScriptManager ID="asm" runat="server" />

Salvare ed eseguire la pagina: è possibile selezionare e deselezionare entrambe le caselle di controllo, ma in nessun momento è possibile selezionare entrambe le caselle di controllo.

È possibile selezionare una sola casella di controllo alla volta (Fare clic per visualizzare l'immagine full-size)

Indietro