Loop y examine los valores de control CheckBox en una columna DataGrid mediante ASP.NET y Visual Basic .NET

En este artículo se describe cómo recorrer en bucle cada fila de un control DataGrid de ASP.NET y cómo determinar si se ha seleccionado el ASP.NET control de servidor CheckBox que se usa para identificar la fila.

Versión original del producto:   Visual Basic
Número de KB original:   321881

Resumen

El código de ejemplo de este artículo usa la Microsoft SQL Server base de datos Northwind para rellenar el control DataGrid y, a continuación, agrega un control de servidor CheckBox a la columna inicial de cada fila. Se trata de una técnica común que permite a los usuarios seleccionar varias filas específicas en una instancia de DataGrid.

En este artículo se hace referencia a los siguientes espacios de nombres .NET Framework biblioteca de clases:

  • System.Data.SqlClient
  • System.Text

Requisitos

  • Windows
  • .NET Framework
  • Internet Information Services (IIS)
  • Visual Studio .NET

Creación de una aplicación web de ASP.NET mediante Visual Basic .NET

  1. Inicie Visual Studio .NET.
  2. En el menú Archivo, seleccione Nuevo y luego Proyecto.
  3. En el cuadro de diálogo Nuevo Project, seleccione Visual Basic Proyectos en Tipos de Project y, a continuación, seleccione ASP.NET aplicación web en Plantillas.
  4. En el cuadro Ubicación , reemplace el nombre predeterminado de WebApplication# por MyWebApp. Si usa el servidor local, puede dejar el nombre del servidor como http://localhost. El cuadro Location resultante aparece como http://localhost/MyWebApp.

Crear la página de formulario web de ejemplo

  1. Agregue un nuevo formulario web a la aplicación web de ASP.NET como se indica a continuación:

    1. Haga clic con el botón derecho en el nodo del proyecto en Explorador de soluciones, seleccione Agregary, a continuación, haga clic en Agregar formulario web.
    2. En el cuadro Nombre , escriba MySample.aspx y, a continuación, seleccione Abrir.
  2. En la ventana Propiedades , cambie la propiedad pageLayout del documento a FlowLayout. Aunque no es necesario hacerlo para usar el código de ejemplo, esto hará que la presentación parezca más limpia.

  3. Agregue un control DataGrid, button y label server a la página de la siguiente manera:

    1. Arrastre un control de servidor ASP.NET DataGrid desde el cuadro de herramientas de Web Forms a la página.
    2. En la ventana Propiedades , cambie el identificador del control DataGrid a DemoGrid.
    3. Arrastre un control de servidor button de ASP.NET desde el cuadro de herramientas de Web Forms a la página situada debajo de DataGrid.
    4. En la ventana Propiedades , cambie el identificador del control Botón a GetSelections y, a continuación, cambie la propiedad Text a Obtener selecciones.
    5. Arrastre un control de servidor ASP.NET Label desde el cuadro de herramientas de Web Forms a la página situada debajo del control Botón.
    6. En la ventana Propiedades , cambie el identificador del control Label a ResultsInfo y, a continuación, elimine cualquier texto de la propiedad Text .
  4. Cambie a la vista HTML en el editor. Agregue el código a la plantilla DataGrid predeterminada para construir las columnas. El código resultante del control debe aparecer de la siguiente manera:

    <asp:DataGrid id="DemoGrid" runat="server" DataKeyField="CustomerID">
        <Columns>
            <asp:TemplateColumn HeaderText="Customer">
                <ItemTemplate>
                    <asp:CheckBox ID="myCheckbox" Runat="server" />
                </ItemTemplate>
            </asp:TemplateColumn>
        </Columns>
    </asp:DataGrid>
    
  5. Haga clic con el botón derecho en la página y, a continuación, haga clic en Ver código. Se abre el archivo de clase de código subyacente en el editor. Agregue las siguientes referencias de espacio de nombres al archivo de clase de código subyacente:

    Imports System.Data.SqlClient
    Imports System.Text
    
  6. Reemplace el código existente para el controlador de Page_Load eventos por el código siguiente:

    Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
       If Not IsPostBack Then
          'Create a SqlConnection object.
          'Modify the connection string as necessary for your environment.
          Dim cn As SqlConnection = New SqlConnection("Server=localhost;database=Northwind;UID=sa;PWD=")
          Dim cmd As SqlCommand = New SqlCommand("SELECT * FROM Customers", cn)
          cn.Open()
          Dim reader As SqlDataReader = cmd.ExecuteReader()
          DemoGrid.DataSource = reader
          DataBind()
          reader.Close()
          cn.Close()
       End If
    End Sub
    
  7. Cambie a la vista Diseño y, a continuación, haga doble clic en GetSelections. Se abre el archivo de clase de código subyacente en el editor. Reemplace el código existente en el controlador de GetSelections_Click eventos por el código siguiente:

    Private Sub GetSelections_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles GetSelections.Click
        Dim rowCount As Integer = 0
        Dim gridSelections As StringBuilder = New StringBuilder()'Loop through each DataGridItem, and determine which CheckBox controls
        'have been selected.
        Dim DemoGridItem As DataGridItem
        For Each DemoGridItem In DemoGrid.Items
    
            Dim myCheckbox As CheckBox = CType(DemoGridItem.Cells(0).Controls(1), CheckBox)
            If myCheckbox.Checked = True Then
                rowCount += 1
                gridSelections.AppendFormat("The checkbox for {0} was selected<br>", _
                DemoGrid.DataKeys(DemoGridItem.ItemIndex).ToString())
            End If
        Next
        gridSelections.Append("<hr>")
        gridSelections.AppendFormat("Total number selected is: {0}<br>", rowCount.ToString())
        ResultsInfo.Text = gridSelections.ToString()
    End Sub
    

Comprobar que funciona

  1. En el menú Archivo , haga clic en Guardar todo para guardar el formulario web y otros archivos asociados al proyecto.

  2. En el menú Compilar del entorno de desarrollo integrado (IDE) de .NET Visual Studio, haga clic en Compilar solución.

  3. En Explorador de soluciones, haga clic con el botón derecho en la página Formulario web (MySample.aspx) y, a continuación, haga clic en Ver en el explorador. Observe que la página muestra los datos en la cuadrícula. Además, aparece una casilla en la primera columna de cada fila. El usuario puede hacer clic para activar esta casilla para marcar filas específicas.

  4. Haga clic para seleccionar algunas de las casillas de las filas y, a continuación, haga clic en Obtener selecciones.

    Una vez que la página realiza un recorrido de ida y vuelta al servidor y ejecuta el código en el GetSelections_Click controlador de eventos, aparece una lista de los elementos seleccionados en el paso anterior. El código del GetSelections_Click controlador de eventos recorre en bucle cada uno DataGridItem de los ASP.NET control de servidor DataGrid, determina si la propiedad Checked del control CheckBox relacionado es true y, a continuación, registra el valor de clave asociado en esa posición específica para el DataKeys de DataGrid.

Referencias