|
Este artículo se tradujo de forma manual. Mueva el puntero sobre las frases del artículo para ver el texto original.
|
Traducción
Original
|
Tutorial: Realizar actualizaciones masivas en filas enlazadas a un control de servidor web GridView
Establecer conexión con una base de datos de SQL Server en Microsoft Visual Web Developer. Utilizar el control SqlDataSource para administrar el acceso a datos. Mostrar los datos devueltos de la base de datos en el control GridView. Configurar el control GridView para permitir a los usuarios editar varias filas de una vez.
Visual Web Developer (Visual Studio). Microsoft Data Access Components (MDAC) versión 2.7 o posterior. Si utiliza Microsoft Windows XP o Windows Server 2003, ya dispone de MDAC 2.7. Sin embargo, si utiliza Microsoft Windows 2000, tal vez necesite actualizar la versión de MDAC instalada en su equipo. Para obtener más información, vea Microsoft Data Access Components (MDAC) Installation en la biblioteca de MSDN. Obtener acceso a la base de datos Northwind de SQL Server. Si necesita una copia de la base de datos Northwind para SQL Server, vea Installing Sample Databases en SQL Server 2005 Books Online.
NotaSi necesita información sobre cómo iniciar sesión en el equipo en que se ejecuta SQL Server, póngase en contacto con el administrador del servidor.
Para crear un sitio web del sistema de archivos
Abra Visual Web Developer. En el menú Archivo, haga clic en Nuevo y, a continuación, haga clic en Sitio Web. Si utiliza Visual Web Developer Express, en el menú Archivo, haga clic en Nuevositio Web. Aparece el cuadro de diálogo Nuevo sitio Web. En Plantillas instaladas de Visual Studio, haga clic en Sitio web ASP.NET. En la lista Ubicación, haga clic en Sistema de archivos y escriba el nombre de la carpeta donde desee guardar las páginas del sitio Web. Por ejemplo, escriba el nombre de carpeta C:\WebSites\BulkUpdate. En la lista Lenguaje, haga clic en el lenguaje de programación con el que desee trabajar. Haga clic en Aceptar. Visual Web Developer crea la carpeta y una nueva página denominada Default.aspx.
Una conexión con un origen de datos como una base de datos. En el procedimiento siguiente creará una conexión a la base de datos Northwind de SQL Server. Un control de origen de datos en la página, que interactúa con el origen de datos (la base de datos) para leer y escribir datos. Un control en la página para mostrar los datos.
Para agregar un origen de datos al control GridView
Abra o cambie a la página Default.aspx. Cambie a la vista Diseño. Arrastre un control SqlDataSource desde la ficha Datos del Cuadro de herramientas hasta la página. Si la etiqueta inteligente Tareas de SqlDataSource no aparece, haga clic con el botón secundario del mouse en el control SqlDataSource y haga clic en Mostrar etiqueta inteligente. En el menú Tareas de SqlDataSource, haga clic en Configurar origen de datos. Aparecerá el asistente Configurar origen de datos. Haga clic en Nueva conexión. Aparece el cuadro de diálogo Agregar conexión. Si se requiere, siga uno de los procedimientos siguientes. La Interfaz de usuario exacta que ve depende de las conexiones de datos que haya realizado previamente en Visual Web Developer. Si la lista Origen de datos no muestra Microsoft SQL Server (SqlClient), haga clic en Cambiar y, en el cuadro de diálogo Cambiar origen de datos, seleccione Microsoft SQL Server. Si aparece el cuadro de diálogo Elegir origen de datos en lugar del cuadro de diálogo Propiedades de la conexión, en la lista Origen de datos, seleccione el tipo de origen de datos que desea utilizar. Para este tutorial, el tipo de origen de datos es Microsoft SQL Server. En la lista Proveedor de datos, haga clic en Proveedor de datos de .NET Framework para servidor SQL Server y, a continuación, haga clic en Continuar.
En la página Agregar conexión, en el cuadro de texto Nombre de servidor, escriba el nombre del equipo en el que se ejecuta la base de datos Northwind de SQL Server. En la sección Conexión con el servidor, seleccione la opción adecuada para tener acceso a la base de datos de SQL Server (seguridad integrada o Id. y contraseña específicos). Si se requiere, escriba un nombre de usuario y contraseña.
NotaSi necesita información sobre cómo iniciar sesión en el equipo en que se ejecuta SQL Server, póngase en contacto con el administrador del servidor. Si escribe una contraseña, active la casilla Guardar mi contraseña. Haga clic en Seleccionar o escribir nombre de base de datos y, a continuación, escriba Northwind. Haga clic en Probar conexión y, cuando tenga la seguridad de que funciona, haga clic en Aceptar. En el asistente Configurar origen de datos, haga clic en Siguiente. Asegúrese de que está activada la casilla Sí, guardar esta conexión como. Asigne a la conexión el nombre NorthwindConnectionString y, a continuación, haga clic en Siguiente. En la página Configurar la instrucción Select, seleccione Especificar columnas de una tabla o vista. En la lista Nombre, seleccione Employees. En Columnas, seleccione EmployeeID, LastName y FirstName. Haga clic en Avanzado. Active la casilla Generar instrucciones INSERT, UPDATE y DELETE y, a continuación, haga clic en Aceptar. Haga clic en Siguiente. Haga clic en Finalizar.
Para agregar y configurar un control GridView que permita mostrar datos
Asegúrese de que está en la vista Diseño en la página Default.aspx. Desde la ficha Datos del Cuadro de herramientas, arrastre un control GridView a la página. En el panel Tareas de GridView, en el cuadro de lista Elegir origen de datos, seleccione el control SqlDataSource que agregó anteriormente, SqlDataSource1. Seleccione Habilitar paginación. Haga clic en Editar columnas. Aparece el cuadro de diálogo Campos. En Campos seleccionados, seleccione FirstName. Haga clic en Convertir este informe en TemplateField. Convierta el campo LastName en un campo de plantilla siguiendo los mismos pasos que con el campo FirstName. No convierta el campo EmployeeId, porque contiene la clave principal y, por tanto, no es modificable. Haga clic en Aceptar. En el menú Tareas de GridView, seleccione Editar plantillas. En la lista Mostrar, en FirstName, haga clic en EditItemTemplate. El control GridView muestra un área modificable con el diseño predeterminado para la columna FirstName en modo de edición. Haga clic con el botón secundario del mouse en el control TextBox de EditItemTemplate y, a continuación, haga clic en Copiar. Haga clic con el botón secundario del mouse en el control GridView y, a continuación, haga clic en Mostrar etiqueta inteligente. En la lista Mostrar, en FirstName, haga clic en ItemTemplate. El control GridView muestra ahora el diseño predeterminado de la columna FirstName en modo de presentación. Elimine el control Label existente. Haga clic con el botón secundario del mouse en el área modificable ItemTemplate y, a continuación, haga clic en Pegar. Ha copiado el control TextBox, incluso su configuración del enlace de datos, del diseño EditItemTemplate al diseño ItemTemplate. Seleccione el control TextBox y, en la ventana Propiedades, establezca la propiedad (ID) en FirstNameTextBox. Esto asegura que el control TextBox que pegó tiene un identificador distinto del que copió. Establezca la propiedad MaxLength en 10 (la longitud máxima del campo en la base de datos). Esto garantiza que los usuarios no escriban más información de la que el campo FirstName está configurado para almacenar. Repita los nueve pasos anteriores, pero esta vez modifique el campo LastName. Reemplace el control Label existente por un control TextBox copiado del diseño EditItemTemplate y, a continuación, establezca la propiedad ID en LastNameTextBox. Para la propiedad MaxLength del control TextBox, especifique un valor de 20. Haga clic con el botón secundario del mouse en el control GridView y, a continuación, haga clic en Terminar edición de plantilla.
Agregue un control Button y en su controlador Click, agregue el código para actualizar masivamente los cambios de cada fila del control GridView. Agregue un objeto DataTable que almacene los valores de datos originales. Agregue el código para determinar si se ha modificado una fila. Los valores actuales mostrados en el control GridView se compararán con los valores originales almacenados en el objeto DataTable. Si uno o varios de los valores mostrados no coinciden con el valor original, la fila se actualizará en la base de datos. En caso contrario, la fila no se incluirá en la actualización masiva.
Para crear un procedimiento con objeto de realizar la actualización masiva
Cambie a la vista Diseño. Seleccione el control GridView y, en la ventana Propiedades, haga clic en el botón Eventos () para mostrar los eventos del control GridView. En el campo RowDataBound, escriba GridView1_RowDataBound y, a continuación, presione ENTRAR. Visual Web Developer crea un controlador de eventos para el evento RowDataBound del control GridView. El código debe tener la apariencia del ejemplo de código siguiente. Reemplace el procedimiento generado con el código siguiente (incluso las variables privadas). private bool tableCopied = false; private System.Data.DataTable originalDataTable; protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.DataRow) if (!tableCopied) { originalDataTable = ((System.Data.DataRowView)e.Row.DataItem).Row.Table.Copy(); ViewState["originalValuesDataTable"] = originalDataTable; tableCopied = true; } }
El código se ejecuta siempre que el control GridView realice el enlace de datos. Mientras la primera fila se está enlazando, el código guarda una copia de los valores de la base de datos original en un objeto DataTable, que se almacena a su vez en ViewState. Cambie a la vista Diseño. Desde la ficha Estándar del cuadro de herramientas, arrastre un control Button a la página. En la ventana Propiedades, haga clic en el botón Propiedades () para mostrar las propiedades del control Button. En el campo (Id.), escriba UpdateButton. En el campo Texto, escriba Update. Haga clic en el botón Eventos () para mostrar los eventos del control Button. En el campo Click, escriba UpdateButton_Click y, a continuación, presione ENTRAR. Visual Web Developer crea un controlador de evento para el evento Click del control Button. El código debe tener la apariencia del ejemplo de código siguiente. Reemplace el procedimiento generado con el código siguiente. protected void UpdateButton_Click(object sender, EventArgs e) { originalDataTable = (System.Data.DataTable)ViewState["originalValuesDataTable"]; foreach (GridViewRow r in GridView1.Rows) if (IsRowModified(r)) { GridView1.UpdateRow(r.RowIndex, false); } // Rebind the Grid to repopulate the original values table. tableCopied = false; GridView1.DataBind(); } protected bool IsRowModified(GridViewRow r) { int currentID; string currentLastName; string currentFirstName; currentID = Convert.ToInt32(GridView1.DataKeys[r.RowIndex].Value); currentLastName = ((TextBox)r.FindControl("LastNameTextBox")).Text; currentFirstName = ((TextBox)r.FindControl("FirstNameTextBox")).Text; System.Data.DataRow row = originalDataTable.Select(String.Format("EmployeeID = {0}", currentID))[0]; if (!currentLastName.Equals(row["LastName"].ToString())) { return true; } if (!currentFirstName.Equals(row["FirstName"].ToString())) { return true; } return false; }
NotaEl procedimiento realiza una comparación de cadenas utilizando el valor de cada control TextBox modificable y el valor almacenado en el objeto DataTable en memoria caché. Si ha dado formato al texto en el control TextBox, los valores podrían ser equivalentes, pero sus representaciones de cadena no coincidirán. Por ejemplo, si ha dado formato a un valor DateTime utilizando el formato de fecha pequeño ({0:d}), el valor del control TextBox de fecha podría ser 3/2/2005. La representación de cadena del valor de fecha del objeto DataTable sería 3/2/2005 12:00 AM. En estos casos, debe agregar lógica de comparación que tiene en cuenta los formatos y la configuración de la localización. El procedimiento itera por filas del control GridView y llama a la función personalizada IsRowModified en cada fila. La acción compara la fila actual con la fila correspondiente del objeto DataTable y devuelve true si la fila ha cambiado. En las filas que han cambiado, el código del controlador Click del botón llama al método UpdateRow del control GridView.
Para probar la página
Presione CTRL+F5 para ejecutar la página. La página se muestra en el explorador. El control GridView muestra las filas de datos de la tabla Northwind Employees en páginas modificables de datos. Modifique algunos valores. Haga clic en Actualizar. Las filas modificadas se actualizan en la base de datos. Cierre el explorador.
Descripción
Código
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="VB_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" DeleteCommand="DELETE FROM [Employees] WHERE [EmployeeID] = @EmployeeID" InsertCommand="INSERT INTO [Employees] ([LastName], [FirstName]) VALUES (@LastName, @FirstName)" SelectCommand="SELECT [EmployeeID], [LastName], [FirstName] FROM [Employees]" UpdateCommand="UPDATE [Employees] SET [LastName] = @LastName, [FirstName] = @FirstName WHERE [EmployeeID] = @EmployeeID"> <DeleteParameters> <asp:Parameter Name="EmployeeID" Type="Int32" /> </DeleteParameters> <UpdateParameters> <asp:Parameter Name="LastName" Type="String" /> <asp:Parameter Name="FirstName" Type="String" /> <asp:Parameter Name="EmployeeID" Type="Int32" /> </UpdateParameters> <InsertParameters> <asp:Parameter Name="LastName" Type="String" /> <asp:Parameter Name="FirstName" Type="String" /> </InsertParameters> </asp:SqlDataSource> <asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" DataKeyNames="EmployeeID" DataSourceID="SqlDataSource1"> <Columns> <asp:BoundField DataField="EmployeeID" HeaderText="EmployeeID" InsertVisible="False" ReadOnly="True" SortExpression="EmployeeID" /> <asp:TemplateField HeaderText="LastName" SortExpression="LastName"> <EditItemTemplate> <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("LastName") %>'></asp:TextBox> </EditItemTemplate> <ItemTemplate> <asp:TextBox ID="LastNameTextBox" runat="server" MaxLength="20" Text='<%# Bind("LastName") %>'></asp:TextBox> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="FirstName" SortExpression="FirstName"> <EditItemTemplate> <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("FirstName") %>'></asp:TextBox> </EditItemTemplate> <ItemTemplate> <asp:TextBox ID="FirstNameTextBox" runat="server" MaxLength="10" Text='<%# Bind("FirstName") %>'></asp:TextBox> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> <asp:Button ID="UpdateButton" runat="server" Height="26px" Text="Update" /> </div> </form> </body> </html>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" DeleteCommand="DELETE FROM [Employees] WHERE [EmployeeID] = @EmployeeID" InsertCommand="INSERT INTO [Employees] ([LastName], [FirstName]) VALUES (@LastName, @FirstName)" SelectCommand="SELECT [EmployeeID], [LastName], [FirstName] FROM [Employees]" UpdateCommand="UPDATE [Employees] SET [LastName] = @LastName, [FirstName] = @FirstName WHERE [EmployeeID] = @EmployeeID"> <DeleteParameters> <asp:Parameter Name="EmployeeID" Type="Int32" /> </DeleteParameters> <UpdateParameters> <asp:Parameter Name="LastName" Type="String" /> <asp:Parameter Name="FirstName" Type="String" /> <asp:Parameter Name="EmployeeID" Type="Int32" /> </UpdateParameters> <InsertParameters> <asp:Parameter Name="LastName" Type="String" /> <asp:Parameter Name="FirstName" Type="String" /> </InsertParameters> </asp:SqlDataSource> <asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" DataKeyNames="EmployeeID" DataSourceID="SqlDataSource1" onrowdatabound="GridView1_RowDataBound"> <Columns> <asp:BoundField DataField="EmployeeID" HeaderText="EmployeeID" InsertVisible="False" ReadOnly="True" SortExpression="EmployeeID" /> <asp:TemplateField HeaderText="LastName" SortExpression="LastName"> <EditItemTemplate> <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("LastName") %>'></asp:TextBox> </EditItemTemplate> <ItemTemplate> <asp:TextBox ID="LastNameTextBox" runat="server" MaxLength="20" Text='<%# Bind("LastName") %>'></asp:TextBox> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="FirstName" SortExpression="FirstName"> <EditItemTemplate> <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("FirstName") %>'></asp:TextBox> </EditItemTemplate> <ItemTemplate> <asp:TextBox ID="FirstNameTextBox" runat="server" MaxLength="10" Text='<%# Bind("FirstName") %>'></asp:TextBox> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> <asp:Button ID="UpdateButton" runat="server" onclick="UpdateButton_Click" Text="Update" /> </div> </form> </body> </html>
Partial Class VB_Default Inherits System.Web.UI.Page Private tableCopied As Boolean = False Private originalDataTable As System.Data.DataTable Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound If e.Row.RowType = DataControlRowType.DataRow Then If Not tableCopied Then originalDataTable = CType(e.Row.DataItem, System.Data.DataRowView).Row.Table.Copy() ViewState("originalValuesDataTable") = originalDataTable tableCopied = True End If End If End Sub Protected Sub UpdateButton_Click(ByVal sender As Object, ByVal e As EventArgs) Handles UpdateButton.Click originalDataTable = CType(ViewState("originalValuesDataTable"), System.Data.DataTable) For Each r As GridViewRow In GridView1.Rows If IsRowModified(r) Then GridView1.UpdateRow(r.RowIndex, False) Next ' Rebind the Grid to repopulate the original values table. tableCopied = False GridView1.DataBind() End Sub Protected Function IsRowModified(ByVal r As GridViewRow) As Boolean Dim currentID As Integer Dim currentLastName As String Dim currentFirstName As String currentID = Convert.ToInt32(GridView1.DataKeys(r.RowIndex).Value) currentLastName = CType(r.FindControl("LastNameTextBox"), TextBox).Text currentFirstName = CType(r.FindControl("FirstNameTextBox"), TextBox).Text Dim row As System.Data.DataRow = _ originalDataTable.Select(String.Format("EmployeeID = {0}", currentID))(0) If Not currentLastName.Equals(row("LastName").ToString()) Then Return True If Not currentFirstName.Equals(row("FirstName").ToString()) Then Return True Return False End Function End Class
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } private bool tableCopied = false; private System.Data.DataTable originalDataTable; protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.DataRow) if (!tableCopied) { originalDataTable = ((System.Data.DataRowView)e.Row.DataItem).Row.Table.Copy(); ViewState["originalValuesDataTable"] = originalDataTable; tableCopied = true; } } protected void UpdateButton_Click(object sender, EventArgs e) { originalDataTable = (System.Data.DataTable)ViewState["originalValuesDataTable"]; foreach (GridViewRow r in GridView1.Rows) if (IsRowModified(r)) { GridView1.UpdateRow(r.RowIndex, false); } // Rebind the Grid to repopulate the original values table. tableCopied = false; GridView1.DataBind(); } protected bool IsRowModified(GridViewRow r) { int currentID; string currentLastName; string currentFirstName; currentID = Convert.ToInt32(GridView1.DataKeys[r.RowIndex].Value); currentLastName = ((TextBox)r.FindControl("LastNameTextBox")).Text; currentFirstName = ((TextBox)r.FindControl("FirstNameTextBox")).Text; System.Data.DataRow row = originalDataTable.Select(String.Format("EmployeeID = {0}", currentID))[0]; if (!currentLastName.Equals(row["LastName"].ToString())) { return true; } if (!currentFirstName.Equals(row["FirstName"].ToString())) { return true; } return false; } }