Uso de ASPxGridView para Insertar y Actualizar

La suite de controles de Developer Express,  es amplia y nos brinda muchas mejoras en el desarrollo de aplicaciones .NET.   

 El ASPXGridView es un excelente control que nos permitirá de manera fácil,  filtrar, ordenar y paginar nuestros datos,  además de mejorar la presentación.

 El ejemplo que posteo a continuacion realiza el enlace al control por medio de código, además nos facilita la inserción y actualización de datos, sin utilizar el un datasource tipado o enlazado.  Haremos uso de la base de datos Northwind y la tabla Products para el ejemplo.

1.  Agregamos un ASPxGridView  que se llama por defecto:  ASPxGridView1

2. Generamos la carga de datos desde el evento Load del formulario:

Dim dt As New DataTable

Dim da As New SqlDataAdapter("select * from products", _

ConfigurationManager.ConnectionStrings("ConnectionString").ConnectionString)

      da.Fill(dt)

      ASPxGridView1.DataSource = dt

      ASPxGridView1.DataBind()

3.  Definiremos las columnas que mostraremos en el grid,  además de otras propiedades. 

Nos permitirá habilitar el popup que mostrara un formulario de captura.

<SettingsEditing Mode="PopupEditForm" PopupEditFormWidth="400px" /> 

Nos permitirá ubicarnos en cada fila

<SettingsBehavior AllowFocusedRow =true />

Dentro de Templates crearemos el Formulario Popup que mostrara los datos seleccionados ademas de poder inserter uno Nuevo.

A Continuación remplazaremos el código que forma el ASPxGridView1 por el siguiente código:

   <dx:ASPxGridView ID="ASPxGridView1" runat="server" KeyFieldName="ProductID"

            AutoGenerateColumns=False>

        <Columns>

                <dx:GridViewCommandColumn VisibleIndex="0">

                        <EditButton Visible="True" />

                        <NewButton Visible="True" />

                  dx:GridViewCommandColumn>

                 

                 

                <dx:GridViewDataTextColumn FieldName="ProductID" VisibleIndex="1">

                dx:GridViewDataTextColumn>

                <dx:GridViewDataTextColumn FieldName="ProductName" VisibleIndex="2">

                dx:GridViewDataTextColumn>

                 

                 

        Columns>

        <SettingsEditing Mode="PopupEditForm" PopupEditFormWidth="400px" />

        <SettingsBehavior AllowFocusedRow =true />

       

        <Templates>

                  <EditForm>

                  <div style="padding:4px 4px 3px 4px">

                         <asp:Label ID="lblProducto" runat=server Text='<%#Eval("ProductID")%>'>asp:Label>

                         <br />

                         Producto: <asp:TextBox ID="txtNombre" Width=300px runat=server Text='<%#Eval("ProductName")%>'>asp:TextBox>

                         <br />

                         Precio: <asp:TextBox ID="txtPrecio" Width=300px runat=server Text='<%#Eval("UnitPrice")%>'>asp:TextBox>

                         <br />

                         Cantidad x Unidad: <asp:TextBox ID="txtCantidad" Width=300px runat=server Text='<%#Eval("QuantityPerUnit")%>'>asp:TextBox>

                        

                        

                  div>

                  <div style="text-align:right; padding:2px 2px 2px 2px">

                        <dx:ASPxGridViewTemplateReplacement ID="Registrar" ReplacementType="EditFormUpdateButton" runat="server">dx:ASPxGridViewTemplateReplacement>

                        <dx:ASPxGridViewTemplateReplacement ID="Cancelar" ReplacementType="EditFormCancelButton" runat="server">dx:ASPxGridViewTemplateReplacement>

                  div>

                  EditForm>

            Templates>

       

    dx:ASPxGridView>

4.  Crearemos los eventos ASPxGridView1_RowInserting y ASPxGridView1_RowUpdating para insertar y actualizar registros.  Nótese que buscaremos cada uno de los controles definidos en la pagina instanciándolos a un objeto en el evento del mismo tipo.   Al final utlizaremos e.Cancel = True para evitar que busque un método de actualización automático que no está implementado, ya que lo estamos haciendo manual.  Agregaremos los dos métodos a continuación:

  Protected Sub ASPxGridView1_RowInserting(ByVal sender As Object, ByVal e As DevExpress.Web.Data.ASPxDataInsertingEventArgs) Handles ASPxGridView1.RowInserting

        Dim lblProducto As Label = TryCast(ASPxGridView1.FindEditFormTemplateControl("lblProducto"), Label)

        Dim txtNombre As TextBox = TryCast(ASPxGridView1.FindEditFormTemplateControl("txtNombre"), TextBox)

        Dim txtPrecio As TextBox = TryCast(ASPxGridView1.FindEditFormTemplateControl("txtPrecio"), TextBox)

        Dim txtCantidad As TextBox = TryCast(ASPxGridView1.FindEditFormTemplateControl("txtCantidad"), TextBox)

        Dim conn As New SqlConnection(ConfigurationManager.ConnectionStrings("ConnectionString").ConnectionString)

        Dim cmd As New SqlCommand("INSERT INTO Products (ProductName, UnitPrice, QuantityPerUnit, Discontinued) VALUES ('" & txtNombre.Text & "', '" & txtPrecio.Text & "', '" & txtCantidad.Text & "', 0)", conn)

        conn.Open()

        cmd.ExecuteNonQuery()

        conn.Close()

        e.Cancel = True

    End Sub

    Protected Sub ASPxGridView1_RowUpdating(ByVal sender As Object, ByVal e As DevExpress.Web.Data.ASPxDataUpdatingEventArgs) Handles ASPxGridView1.RowUpdating

        Dim lblProducto As Label = TryCast(ASPxGridView1.FindEditFormTemplateControl("lblProducto"), Label)

        Dim txtNombre As TextBox = TryCast(ASPxGridView1.FindEditFormTemplateControl("txtNombre"), TextBox)

        Dim txtPrecio As TextBox = TryCast(ASPxGridView1.FindEditFormTemplateControl("txtPrecio"), TextBox)

        Dim txtCantidad As TextBox = TryCast(ASPxGridView1.FindEditFormTemplateControl("txtCantidad"), TextBox)

        Dim conn As New SqlConnection(ConfigurationManager.ConnectionStrings("ConnectionString").ConnectionString)

        Dim cmd As New SqlCommand("UPDATE Products SET ProductName='" & txtNombre.Text & "' WHERE ProductId='" & lblProducto.Text & "'", conn)

        conn.Open()

        cmd.ExecuteNonQuery()

        conn.Close()

        e.Cancel = True

    End Sub

Finalmente hemos implementado la inserción y actualización de registros en el aspxGridView de Developer Express sin utilizar asistentes o mecanismos tipados,  lo hemos hecho manual lo cual nos da mayor control de lo que queremos realizar.    A continuación el Link donde podemos descargar el proyecto completo.

http://www.4shared.com/file/bOHqLvgt/GridViewTemplate.html