AspNet Utilizzare il controllo checkbox in un gridview
In questo articolo, vedremo come dotare un controllo gridview con una colonna di tipo checkbox.
.png)
Figura 1
Introduzione
In questo articolo, vedremo come applicare in un controllo GridView un checkbox, e la possibilità di selezionare o deselezionare le varie caselle.
Dopo aver creato un nuovo progetto web in Visual Studio 2005, inseriamo nella pagina web, un controllo gridview e due pulsanti, come mostra in figura 1.
Impostazione delle colonne del gridView.
Il gridView sarà composto da tre colonne, una di tipo checkbox e due che fanno riferimento ad una fonte dati (colonne di un datatable), nell'intestazione del gridiview, si troverà un checkbox che permette di selezionare e deselezionare tutti gli elementi checkbox di quella pagina.
Di seguito si riporta il codice html, per impostare le varie colonne del controllo gridview.
<Columns>
<asp:TemplateField >
<HeaderTemplate >
<input id="Seleziona" onclick="javascript:Seleziona(this);" runat ="server"type="checkbox" />
</HeaderTemplate >
<ItemTemplate >
<asp:CheckBox ID="chkSeleziona" runat="server" Text=" " Width="18px" />
</ItemTemplate >
</asp:TemplateField >
<asp:BoundField HeaderText="Valore A" DataField="Valore A" />
<asp:BoundField HeaderText="Valore B" DataField="Valore B" />
</Columns >
Come mostrato dal codice html, l'evento onClick del controllo checkbox, eseguirà una funzione javascript, la quale seleziona o deseleziona i vari checkbox nel controllo.
Di seguito si riporta la funzione codice javascript.
<script language="javascript">
function Seleziona(Chkbox){
var theBox= (Chkbox.type=="checkbox") ?
Chkbox : Chkbox.children.item[0];
stato=theBox.checked;
elemento=theBox.form.elements;
for(i=0;i<elemento.length;i++)
if(elemento[i].type=="checkbox" &&
elemento[i].id!=theBox.id)
{
if(elemento[i].checked!=stato)
elemento[i].click();
}
}
</script>
Seleziona e deseleziona elemento.
Di seguito si riporta del codice in VB.Net e C#. che permette di selezionare e deselezionare gli elementi del controllo gridview. Questa funzione a differenza della precedente, premette di selezionare e deselezionare gli elementi direttamente dal codice VB.Net e C#.
Codice VB.Net
Private Sub Seleziona(ByVal seleziona As Boolean)
If (seleziona = True) Then
For conta As Integer = 0 To GridView1.Rows.Count - 1
Dim ChkDeSeleziona As CheckBox = CType(GridView1.Rows(conta).FindControl("chkSeleziona"), CheckBox)
ChkDeSeleziona.Checked = True
Next
Else
For conta As Integer = 0 To GridView1.Rows.Count - 1
Dim ChkSeleziona As CheckBox = CType(GridView1.Rows(conta).FindControl("chkSeleziona"), CheckBox)
ChkSeleziona.Checked = False
Next
End If
End Sub
Codice C#
private void Seleziona(bool seleziona)
{
if (!seleziona)
{
for (int contatore = 0; contatore < GridView1.Rows.Count; contatore++)
{
CheckBox ChkDeSeleziona = (CheckBox)GridView1.Rows[contatore].FindControl("chkSeleziona");
ChkDeSeleziona.Checked = false;
}
}
else
{
for (int contatore = 0; contatore < GridView1.Rows.Count; contatore++)
{
CheckBox ChkSeleziona = (CheckBox)GridView1.Rows[contatore].FindControl("chkSeleziona");
ChkSeleziona.Checked = true;
}
}
}
Per selezionare i vari elementi, la funzione dev'essere richimata, passandogli come valore true, mentre per deselezionare tali elementi utilizzeremo false.
Di seguito si riporta un esempio di codice.
VB.Net
Protected Sub BtnSeleziona_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles BtnSeleziona.Click
Seleziona(True)
End Sub
Protected Sub BtnDeseleziona_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles BtnDeseleziona.Click
Seleziona(False)
End Sub
C#
protected void BtnSeleziona_Click(object sender, EventArgs e)
{
Seleziona(true);
}
protected void BtnDeseleziona_Click(object sender, EventArgs e)
{
Seleziona(false);
}
Conclusioni:
In questo articolo, si è visto come applicare in un controllo gridiview delle checkbox ed effettuare la selezione e deselezione sia con il linguaggio VB.Net e sia con C#. Tramite la parola download è possibile scaricare il file di esempio utilizzato nell'articolo.
Download