UNIVERSIDAD DON BOSCO FACULTAD DE ESTUDIOS TECNOLÓGICOS COORDINACION DE COMPUTACIÓN

Transcripción

1 CICLO 02/2015 UNIVERSIDAD DON BOSCO FACULTAD DE ESTUDIOS TECNOLÓGICOS COORDINACION DE COMPUTACIÓN GUIA DE LABORATORIO #9 Nombre de la Práctica: Conectando a Fuentes de Datos Parte II Lugar de Ejecución: Centro de cómputo Tiempo Estimado: 2 horas con 30 minutos MATERIA: Desarrollo de aplicaciones con Software Propietario I. OBJETIVOS Que los estudiantes: 1. Conozcan los objetos y clases necesarias para trabajar con bases de datos en entornos desconectados. 2. Aplicar y comprender los pasos lógicos de creación de copias de bases de datos en caché de servidor 3. Comprender e implementar la forma de actualización de una copia de base de datos con relación a la base de datos original 4. Crear buenas prácticas relacionadas a la gestión de la información en una página web de ASP.NET II. INTRODUCCIÓN TEÓRICA Entorno desconectado de ADO.NET El segundo escenario de acceso a bases de datos relacionales se conoce como Escenario Desconectado, ya que en él una parte de los datos del servidor central se copia localmente y puede luego ser consultada y actualizada sin contar con una conexión abierta. Luego si se desea puede establecerse una conexión con el servidor de base de datos para sincronizar los cambios efectuados sobre la copia local y actualizar los datos. Este tipo de funcionalidad es particularmente útil para escenarios de usuarios móviles, que salen de su oficina con una laptop, un SmartPhone o una PocketPC y desean poder continuar trabajando por más que no tengan conectividad física con el servidor de base de datos ubicado en la red interna de la empresa. Algunas ventajas que provee un escenario de acceso a datos desconectado son: La posibilidad de trabajar sobre los datos independientemente del resto de los usuarios de la aplicación. Mayor escalabilidad en el acceso a datos y utilización más óptima de recursos del servidor, ya que se mantiene en un mínimo indispensable la cantidad y duración de conexiones abiertas. Mayor performance, al trabajar con una copia local de los datos. Desarrollo de Aplicaciones con Software Propietario 1 / 22

2 Algunas Desventajas: Puede ocurrir que en un momento dado un usuario no esté accediendo a los datos más actualizados del repositorio central Al momento de sincronizar los cambios efectuados localmente contra el repositorio central pueden surgir conflictos, los cuales deben ser resueltos manualmente. Clase DataSet El DataSet de ADO.NET es el componente central de la arquitectura sin conexión de ADO.NET. El DataSet está expresamente diseñado para el acceso a datos independientemente del origen de datos. Como resultado, se puede utilizar con múltiples y distintos orígenes de datos, con datos XML o para administrar datos locales de la aplicación. El DataSet contiene una colección de uno o más objetos DataTable formados por filas y columnas de datos, así como información sobre claves principales, claves externas, restricciones y relaciones relativas a los datos incluidos en los objetos DataTable. Objeto estrella en ADO.NET Representa una caché de datos en memoria Contiene DataTables Lee y escribe datos y esquemas en XML Puede ser tipado o no tipado. o Ambos heredan de la clase DataSet El tipado se apoya en un esquema XML (.XSD) para generar la clase El tipado tiene ventajas: o Expone estructura como propiedades y métodos: Intellisense o Recoge la Primary key Desarrollo de Aplicaciones con Software Propietario 2

3 Clase SQLAdapter Representa un conjunto de Commands y una Connection Puente entre el DataSet y la BD Lee y actualiza la BD: SelectCommand, UpdateCommand, InsertCommand DeleteCommand Clase DataTable Representa una tabla en memoria Lo rellena un DataAdapter o a mano Componente principal de los objetos DataSet y DataView Clase DataView Vista personalizada de un objeto DataTable Filtros, ordenación, búsquedas DataRelation Define relaciones entre tablas Utiliza columnas de un DataTable Desarrollo de Aplicaciones con Software Propietario 3

4 III. MATERIALES Y EQUIPO Para la realización de la guía de práctica se requerirá lo siguiente: No. Requerimiento Cantidad 1 Guía de práctica #9: Conectando a Fuentes de Datos Parte II 1 2 Computadora con Visual Studio 2012 instalado y una instancia de SQL Server con Management Studio Express 1 3 Memoria USB o disco flexible 1 IV. PROCEDIMIENTO Ejercicio #1 Creación de base de datos usando SQL Server 2012 para que funcione como fuente de datos. 1. Proceda a iniciar la herramienta Microsoft SQL Server Management Studio instalada en su computadora. Una vez cargada, en el Explorador de objetos, de clic secundario sobre la carpeta Databases del servidor SQL y cree la base de datos EmpresaPlazaLibre. Luego proceda a ejecutar el script (SQLcreacionBDD_EmpresaPlazaLibre.sql) que se le proporciona en los recursos de esta guía. Cuando ya haya ejecutado todas las querys, proceda a verificar mediante un diagrama las relaciones entre las tablas, las cuales deben verse como se muestra a continuación: 2. Proceda a iniciar Microsoft Visual Studio desde su computadora. Cree un sitio web denominado SitioWeb9_CARNET, en donde debe reemplazar CARNET por su respectivo carnet. Desarrollo de Aplicaciones con Software Propietario 4

5 Ejercicio #2 Creación de conexión desde Visual Studio con el origen de datos a través del asistente. 3. Ahora creara una conexión de tal forma que esta se encuentre activa desde nuestra ventana. De esta manera se podrá administrar los objetos de bases de datos desde el IDE. 4. Seleccione al menú Ver e inicie al Explorador de Servidores. Podrá observar que se carga una nueva ventana listando los diferentes servidores asociados a la aplicación. El que nos interesa por el momento es el que indica Conexiones de datos. Desde este punto, agreguemos una nueva conexión, dando clic secundario sobre la opción Conexiones de datos. Automáticamente verá un menú emergente del cual deberá seleccionar la opción de Agregar conexión. 5. Se nos mostrará una ventana con un asistente, donde se nos solicita especificar los parámetros de conexión a nuestro servidor. Estos parámetros son los que se explican en la introducción teórica de esta guía de laboratorio. Procederemos a llenar el formulario presentado de la siguiente forma: del campo Nombre del servidor, seleccione el servidor asociado a su instancia de SQL Server instalada en su computadora. Para conexión con el servidor, debe usar conexión con autenticación de Windows. Posteriormente seleccione la base de datos que creo usted en el inicio de esta guía. La configuración anterior debe quedar como muestra la siguiente imagen. Finalmente de clic en el botón de probar conexión el cual nos indicara si se ha podido establecer la conexión. Si esta ha sido satisfactoria, de clic en Aceptar. Desarrollo de Aplicaciones con Software Propietario 5

6 6. Una vez creada la conexión, procederemos a configurar la cadena de conexión en nuestro archivo web.config, ya que de esta manera se podrá mantener una sola cadena de conexión en todo el sitio. Para ello, de clic secundario sobre la conexión antes establecida y del menú emergente, dar clic en Propiedades. Una vez se carguen las propiedades de la conexión, copia la propiedad Cadena de conexión de la ventana de propiedades. Debe conservar los datos en memoria. Verifique la siguiente imagen. 7. Ahora, editar el archivo web.config de su sitio web, para agregar las siguientes líneas de código. En la etiqueta connectionstring debe colocar el valor de la cadena de conexión copiada en el punto anterior. Para una mejor referencia consulte los pasos de la guía número 8. Al final debe quedar un código similar al que se muestra a continuación: <connectionstrings> <add name="conexion" connectionstring="data Source=localhost;Initial Catalog= EmpresaPlazaLibre;Integrated Security=True" providername="system.data.sqlclient" /> </connectionstrings> Lo que se acaba de realizar es la adición de las cadenas de conexión en el web.config de tal manera que se encuentre disponible en todos nuestros archivos de código del proyecto. Esto es de suma utilidad ya que en casos de que se necesite cambiar la cadena de conexión, únicamente se modifica este archivo a las nuevas referencias de la fuente de datos, sin estar cambiando una a una las conexiones existentes. La etiqueta de conexión describe una propiedad name la cual establece el nombre con la que estableceremos nuestra conexión desde el código en C#. La propiedad connectionstring establece la ruta al servidor de base de datos y la base de datos misma. Finalmente el providername establece el espacio de nombres del proveedor de datos que utilizaremos para la gestión de nuestra conexión. 8. Una vez creado nuestro sitio web, procederemos a configurar las condiciones de trabajo del mismo mediante la inclusión de carpetas y archivos. Para ello, ingresa a la carpeta de recursos de esta Desarrollo de Aplicaciones con Software Propietario 6

7 práctica, selecciona a las 4 subcarpetas y cópialas hacia el interior de la carpeta raíz del sitio (donde tú ubicaste el proyecto al momento de guardar este sitio web). 9. Luego, retorna al explorador de proyectos de Visual Studio y da clic secundario sobre el icono del sitio web y da clic en opción actualizar carpeta. Se agregan las 4 carpetas de recursos al sitio. 10. Procederemos ahora a crear la lógica de nuestra aplicación, para ello proceda a agregar una nueva clase con el nombre conexiondesconetada.cs, en donde se alojará todo el código que gestionará los procesos con la base de datos. using System; Proceda a digitar el siguiente código, tomando en cuenta las instrucciones using adicionales que se han cargado: using System.Collections.Generic; using System.Linq; using System.Web; using System.Data.SqlClient; using System.Configuration; using System.Data; using System.Web.UI.WebControls; public class conexiondesconetada //Declaramos loss objetos que utilizaremos en toda nuestra clase string coneccionstring; SqlConnection conexionsql; DataSet DataSetPrincipal; SqlDataAdapter DataAdapterEspecífico; public conexiondesconetada() //Configuramos la conexion y obtenemos la cadena de conexion desde el Web.config coneccionstring = ConfigurationManager.ConnectionStrings["conexion"].ConnectionString; conexionsql = new SqlConnection( coneccionstring ); DataSetPrincipal = new DataSet(); conexionsql.open(); //Inicializamos el adaptador específico que se utilizará en la gestión de registros de producto DataAdapterEspecífico = new SqlDataAdapter(); Desarrollo de Aplicaciones con Software Propietario 7

8 DataAdapterEspecífico.SelectCommand = new SqlCommand("SELECT * FROM Products", conexionsql); public void conectar() conexionsql.open(); public void desconectar() conexionsql.close(); public void copiarbasedatos() //Cargamos las tablas al dataset a través del método cargartabla cargartabla( "Categories", "CategoryID" ); cargartabla("suppliers", "SupplierID" ); cargartabla( "Products", "ProductID" ); //Establecemos la relacion de llaves foraneas entre las tablas, verifique la sintaxis de cada una de llas ForeignKeyConstraint fk1_cat_pro; fk1_cat_pro=new ForeignKeyConstraint(DataSetPrincipal.Tables["Categories"].Columns["CategoryID"], DataSetPrincipal.Tables["Products"].Columns["CategoryID"]); DataSetPrincipal.Tables["Products"].Constraints.Add(fk1_cat_pro); ForeignKeyConstraint fk1_sup_pro; fk1_sup_pro=new ForeignKeyConstraint(DataSetPrincipal.Tables["Suppliers"].Columns["SupplierID"], DataSetPrincipal.Tables["Products"].Columns["SupplierID"]); DataSetPrincipal.Tables["Products"].Constraints.Add(fk1_sup_pro); public void cargartabla(string nombretabla, String primarykey) nombretabla = nombretabla.trim(); //Si la tabla no existe en el contexto actual, procederemos a adicionarla if (DataSetPrincipal.Tables.IndexOf(nombreTabla) == -1) //Configuramos un control dataadapter para que funcione como puente entre dataset y base de datos Desarrollo de Aplicaciones con Software Propietario 8

9 SqlDataAdapter dataadapter = new SqlDataAdapter(); dataadapter.selectcommand = new SqlCommand(); dataadapter.selectcommand.commandtext = "SELECT * FROM " + nombretabla; dataadapter.selectcommand.connection = conexionsql; dataadapter.selectcommand.commandtype = CommandType.Text; //Populamos el dataset con la tabla que acabamos de obtener dataadapter.fillschema(datasetprincipal, SchemaType.Source, nombretabla); dataadapter.fill(datasetprincipal, nombretabla); dataadapter.selectcommand.dispose(); dataadapter.dispose(); primaria //Obtenemos la tabla actual y establecemos el campo que se utilizará como llave DataTable tablaactual; tablaactual = DataSetPrincipal.Tables[ nombretabla ]; DataColumn[] columnasprincipales = new DataColumn[1]; columnasprincipales[0] = tablaactual.columns[ primarykey ]; tablaactual.primarykey = columnasprincipales; public void llenarcombo(ref DropDownList combobox, String nombretabla, String campovalor, String campotexto) //Asociamos al control de combobox la fuente de datos desde donde obtendrá su información nombretabla = nombretabla.trim(); combobox.datasource = DataSetPrincipal; combobox.datamember = nombretabla; combobox.datavaluefield = campovalor; combobox.datatextfield = campotexto; combobox.databind(); public object[] getdatarow(int ProductID) //Obtenemos un arreglo genérico con los datos de una fila en especifico a la que se le pasa Desarrollo de Aplicaciones con Software Propietario 9

10 como parametro //el ID a seleccionar desde la tabla object[] datosretorno = new object[8]; DataRow[] filaseleccionada; filaseleccionada = DataSetPrincipal.Tables["Products"].Select("ProductID="+ProductID); if (filaseleccionada.length == 1) datosretorno[0] = filaseleccionada[0]["productid"]; datosretorno[1] = filaseleccionada[0]["productname"]; datosretorno[2] = filaseleccionada[0]["supplierid"]; datosretorno[3] = filaseleccionada[0]["categoryid"]; datosretorno[4] = filaseleccionada[0]["quantityperunit"]; datosretorno[5] = filaseleccionada[0]["unitprice"]; datosretorno[6] = filaseleccionada[0]["unitsinstock"]; datosretorno[7] = filaseleccionada[0]["unitsonorder"]; return datosretorno; public void cargarproductosentabla(ref GridView grid, string categoria, string proveedor) grid.columns.clear(); //Cargamos un dataview ya que es el que nos permite hacer filtros sobre la tabla seleccionada DataView vistafiltro = new DataView(DataSetPrincipal.Tables["Products"]); if (categoria!= "0") vistafiltro.rowfilter = "CategoryID = " + categoria; if (proveedor!= "0") vistafiltro.rowfilter = "SupplierID = " + proveedor; //Configuramos el gridview que es pasado por referencia para que su fuente de datos sea el dataview Desarrollo de Aplicaciones con Software Propietario 10

11 //configurado y populado anteriormente, ademas establecemos que el campo principal sea la columna de ProductID grid.datasource = vistafiltro; grid.databind(); grid.allowpaging = true; grid.datakeynames = new String[1]"ProductID"; //Configuramos un boton de editar el cual será añadido al grid ButtonField columnaeditar = new ButtonField(); columnaeditar.headertext = "Editar"; columnaeditar.headerstyle.horizontalalign = HorizontalAlign.Center; columnaeditar.buttontype = ButtonType.Button; columnaeditar.text = "Editar"; columnaeditar.commandname = "Seleccionar"; columnaeditar.controlstyle.cssclass = "button special"; grid.columns.add(columnaeditar); //Configuramos un boton de eliminar que será añadido al grid ButtonField columnaeliminar = new ButtonField(); columnaeliminar.headertext = "Eliminar"; columnaeliminar.headerstyle.horizontalalign = HorizontalAlign.Center; columnaeliminar.buttontype = ButtonType.Button; columnaeliminar.text = "Eliminar"; columnaeliminar.commandname = "Eliminar"; columnaeliminar.controlstyle.cssclass = "button special"; grid.columns.add(columnaeliminar); //Recargamos el grid y seteamos los nombres de las columnas grid.databind(); grid.headerstyle.horizontalalign = HorizontalAlign.Center; grid.headerrow.cells[2].text = "ID"; grid.headerrow.cells[3].text = "Producto"; grid.headerrow.cells[4].text = "Proveedor"; grid.headerrow.cells[5].text = "Categoría"; grid.headerrow.cells[6].text = "Cant/Unidad"; grid.headerrow.cells[7].text = "Precio"; grid.headerrow.cells[8].text = "Disponibles"; grid.headerrow.cells[9].text = "Ordenadas"; Desarrollo de Aplicaciones con Software Propietario 11

12 grid.pagerstyle.cssclass = "pager"; public int actualizarproducto(int ProductID, object[] datosactualizados ) DataRow fila2update; DataTable tablaproductos; tablaproductos = DataSetPrincipal.Tables["Products"]; try fila2update = tablaproductos.rows.find(productid); fila2update["productname"] = datosactualizados[0].tostring(); fila2update["supplierid"] = int.parse(datosactualizados[1].tostring()); fila2update["categoryid"] = int.parse(datosactualizados[2].tostring()); fila2update["quantityperunit"] = datosactualizados[3].tostring(); fila2update["unitprice"] = double.parse(datosactualizados[4].tostring()); fila2update["unitsinstock"] = int.parse(datosactualizados[5].tostring()); fila2update["unitsonorder"] = int.parse(datosactualizados[6].tostring()); if (DataSetPrincipal.HasChanges()) SqlCommandBuilder comando = new SqlCommandBuilder(DataAdapterEspecífico); int filasafectadas = DataAdapterEspecífico.Update(DataSetPrincipal, "Products"); DataSetPrincipal.AcceptChanges(); return filasafectadas; return 0; catch(exception e) return 0; public int eliminarproducto(int ProductID) DataRow fila2delete; Desarrollo de Aplicaciones con Software Propietario 12

13 DataTable tablaproductos; tablaproductos = DataSetPrincipal.Tables["Products"]; try fila2delete = tablaproductos.rows.find(productid); fila2delete.delete(); if (DataSetPrincipal.HasChanges()) SqlCommandBuilder comando = new SqlCommandBuilder(DataAdapterEspecífico); int filasafectadas = DataAdapterEspecífico.Update(DataSetPrincipal, "Products"); DataSetPrincipal.AcceptChanges(); return filasafectadas; return 0; catch return 0; 11. Ahora, proceda a agregar un nuevo Web Form con nombre Default.aspx, y luego digite el siguiente marcado. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE HTML> <html> <head> <title>control de Productos</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]--> <script src="js/jquery.min.js"></script> <script src="js/jquery.scrolly.min.js"></script> <script src="js/jquery.dropotron.min.js"></script> Desarrollo de Aplicaciones con Software Propietario 13

14 <script src="js/jquery.scrollex.min.js"></script> <script src="js/skel.min.js"></script> <script src="js/skel-layers.min.js"></script> <script src="js/init.js"></script> <noscript> <link rel="stylesheet" href="css/skel.css" /> <link rel="stylesheet" href="css/style.css" /> <link rel="stylesheet" href="css/style-xlarge.css" /> </noscript> <!--[if lte IE 9]><link rel="stylesheet" href="css/ie/v9.css" /><![endif]--> <!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]--> </head> <body> <!-- Header --> <header id="header" class="skel-layers-fixed"> <h1 id="logo"><a href="/">página Principal</a></h1> <nav id="nav"> <ul> <li><a href="" class="button special">nuevo Producto</a></li> </ul> </nav> </header> <style>.pager table width: auto!important; </style> <!-- Main --> <div id="main" class="wrapper style1"> <div class="container"> <!-- Formulario de Ingreso de Información --> <section> <form id="form1" runat="server"> <div class="row uniform 50%"> <div class="5u 12u$(xsmall)"> Categoría Desarrollo de Aplicaciones con Software Propietario 14

15 <div class="select-wrapper"><asp:dropdownlist ID="ddlCategorias" runat="server"></asp:dropdownlist> <div class="5u 12u$(xsmall)"> Proveedor <div class="select-wrapper"><asp:dropdownlist ID="ddlProveedor" runat="server"></asp:dropdownlist> <div class="2u 12u$(xsmall)"> <br /> <asp:button ID="btnBuscar" runat="server" Text="Buscar" Width="100%" CssClass="special" /> <div class="12u 12u$(xsmall)"> <asp:gridview ID="GridView1" Width="100%" CssClass="alt" runat="server"></asp:gridview> </form> </section> <!-- Footer --> <footer id="footer"> <ul class="icons"> <li><a href="#" class="icon alt fa-twitter"><span class="label">twitter</span></a></li> <li><a href="#" class="icon alt fa-facebook"><span class="label">facebook</span></a></li> <li><a href="#" class="icon alt fa-envelope"><span class="label"> </span></a></li> </html> </body> </footer> </ul> <ul class="copyright"> </ul> <li> All rights reserved.</li> Desarrollo de Aplicaciones con Software Propietario 15

16 12. En la página de código subyacente (Default.aspx.cs), agregue una nueva variable de tipo conexiondesconectada, llamada nuevaconexion. Esta corresponde a la clase que creamos anteriormente. 13. Luego, en el evento Page_Load, proceda a digitar el siguiente código. Verifique además como se declaró la variable del punto anterior. Posterior a ello, proceda a ejecutar su página y observe lo que se carga en el navegador. 14. Ahora, procede a programar el evento asociado a la paginación del GridView1. Para ello, siempre en la misma página de Default.aspx.cs proceda a digitar el siguiente código teniendo especial cuidado en el nombre del método. 15. Ahora, programaremos el evento asociado a los botones de eliminar y editar creados mediante código y que serán añadidos al GridView en uso. Digita el siguiente código. Desarrollo de Aplicaciones con Software Propietario 16

17 16. Ahora, lo único que nos resta es enlazar dichos eventos con el grid original. Para ello, ubíquese en la vista de código de la página Default.aspx y añada los siguientes atributos AL GRIDVIEW, tal y como se muestra en la figura. Luego proceda a ejecutar la página nuevamente y verifique la paginación de la tabla así como también si es posible eliminar un registro de los mostrados en la tabla. 17. Ahora, en la vista de diseño, de doble clic al botón de buscar para que se cree el respectivo método de OnClick asociado al botón, y luego proceda a digitar el siguiente código. Proceda a ejecutar nuevamente la página y realice cambios en los filtros de búsqueda para determinar el funcionamiento del mismo. 18. Ahora, cree un nuevo WebForm con el nombre de EditarRegistro.aspx y añada el siguiente código. Desarrollo de Aplicaciones con Software Propietario 17

18 Page Language="C#" AutoEventWireup="true" CodeFile="EditarRegistro.aspx.cs" Inherits="EditarRegistro" %> <!DOCTYPE HTML> <html> <head> <title>edición de Producto</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]--> <script src="js/jquery.min.js"></script> <script src="js/jquery.scrolly.min.js"></script> <script src="js/jquery.dropotron.min.js"></script> <script src="js/jquery.scrollex.min.js"></script> <script src="js/skel.min.js"></script> <script src="js/skel-layers.min.js"></script> <script src="js/init.js"></script> <noscript> <link rel="stylesheet" href="css/skel.css" /> <link rel="stylesheet" href="css/style.css" /> <link rel="stylesheet" href="css/style-xlarge.css" /> </noscript> <!--[if lte IE 9]><link rel="stylesheet" href="css/ie/v9.css" /><![endif]--> <!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]--> </head> <body> <!-- Header --> <header id="header" class="skel-layers-fixed"> <h1 id="logo"><a href="/">página Principal</a></h1> </header> <style>.pager table width: auto!important; </style> <!-- Main --> <div id="main" class="wrapper style1"> Desarrollo de Aplicaciones con Software Propietario 18

19 <div class="container"> <!-- Formulario de Ingreso de Información --> <section> <form id="form1" runat="server"> <section> <h3>edición de Registros</h3> <div class="row uniform 50%"> <asp:hiddenfield ID="ProductID" runat="server" /> <div class="6u 12u$(xsmall)"> <asp:label runat="server" Text="Nombre de Producto"></asp:Label> <asp:textbox ID="ProductName" runat="server"></asp:textbox> <div class="6u 12u$(xsmall)"> Proveedor <div class="select-wrapper"><asp:dropdownlist ID="SupplierID" runat="server"></asp:dropdownlist> <div class="6u 12u$(xsmall)"> Categoría <div class="select-wrapper"><asp:dropdownlist ID="CategoryID" runat="server"></asp:dropdownlist> <div class="6u 12u$(xsmall)"> <asp:label runat="server" Text="Cantidad por Unidad"></asp:Label> <asp:textbox ID="QuantityPerUnit" runat="server"></asp:textbox> <div class="6u 12u$(xsmall)"> <asp:label runat="server" Text="Precio Unitario"></asp:Label> <asp:textbox ID="UnitPrice" runat="server"></asp:textbox> <div class="6u 12u$(xsmall)"> <asp:label runat="server" Text="Existencias"></asp:Label> <asp:textbox ID="UnitsInStock" runat="server"></asp:textbox> Desarrollo de Aplicaciones con Software Propietario 19

20 Ordenadas"></asp:Label> runat="server"></asp:textbox> <div class="6u$ 12u$(xsmall)"> <asp:label runat="server" Text="Unidades <asp:textbox <div class="2u 12u$(xsmall)"> <br /> ID="UnitsOnOrder" <asp:button OnClientClick="return confirm(' Desea proceder con la actualización del registro?');" ID="btnModificar" runat="server" Text="Actualizar" Width="100%" CssClass="special" /> </form> </section> </section> <!-- Footer --> <footer id="footer"> <ul class="icons"> <li><a href="#" class="icon alt fa-twitter"><span class="label">twitter</span></a></li> <li><a href="#" class="icon alt fa-facebook"><span class="label">facebook</span></a></li> <li><a href="#" class="icon alt fa-envelope"><span class="label"> </span></a></li> </footer> </ul> <ul class="copyright"> </ul> <li> All rights reserved.</li> </html> </body> Desarrollo de Aplicaciones con Software Propietario 20

21 19. En la página de código subyacente (EditarRegistro.aspx.cs), agregue una nueva variable de tipo conexiondesconectada que corresponde a la clase que creamos anteriormente. El nombre de la variable debe ser nuevaconexion. 20. En el evento Page_Load, proceda a digitar el siguiente código, verifique además como se declaró la variable del punto anterior, posterior a ello, proceda a ejecutar su página y observe lo que se carga en el navegador. 21. Ahora, en la vista de diseño, de doble clic al botón btnmodificar para que se cree el respectivo método de OnClick asociado al botón de modificar, y luego proceda a digitar el siguiente código. Desarrollo de Aplicaciones con Software Propietario 21

22 22. Proceda a ejecutar la página Default.aspx y luego seleccione un registro para editar, modifique algún dato y posteriormente guarde los cambios. V. ANÁLISIS DE RESULTADOS 1. Comente con sus propias palabras y en base a su análisis el código de la clase conexiondesconectada.cs de una forma clara y entendible. 2. Cree una nueva página donde se permita, mediante controles web, ingresar un nuevo registro a la tabla de Products, haciendo uso del entorno desconectado mostrado en la guía. Para ello, puede auxiliarse del método de actualización de producto de la clase conexiondesconectada.cs y del siguiente recurso: VI. BIBLIOGRAFÍA 1. Thierry GROUSSARD. (2013). C# 5: Los fundamentos del lenguaje Desarrollar con Visual Studio Barcelona: ENI Desarrollo de Aplicaciones con Software Propietario 22