1. No category

UNIVERSIDAD DON BOSCO
FACULTAD DE ESTUDIOS TECNOLÓGICOS
ESCUELA DE COMPUTACIÓN
CICLO: 01/2015
Nombre de la Práctica:
Lugar de Ejecución:
Tiempo Estimado:
MATERIA:
DOCENTES:
GUIA DE LABORATORIO #6
Conectando a Fuentes de Datos – Parte III
Centro de cómputo
2 horas con 30 minutos
Lenguaje de Programación II
Karens Medrano / Hugo Dimas
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.
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.
Lenguaje de Programación II
1 / 17
Guía #6: Conectando a Fuentes de Datos – Parte III
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





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
Lenguaje de Programación II
2
Guía #6: Conectando a Fuentes de Datos – Parte III
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
III. MATERIALES Y EQUIPO
Para la realización de la guía de práctica se requerirá lo siguiente:
No.
1
2
3
Requerimiento
Guía de práctica #6: Conectando a Fuentes de Datos – Parte III
Computadora con Visual Studio 2012 instalado y una instancia de SQL
Server con Management Studio Express
Memoria USB o disco flexible
Lenguaje de Programación II
3
Cantidad
1
1
1
Guía #6: Conectando a Fuentes de Datos – Parte III
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 de Microsoft SQL Server Management Studio instalada en su
computadora. Una vez cargada, proceda a crear la base de datos “EmpresaPlazaLibre” y luego
proceda a ejecutar el script 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:
Ejercicio #2 – Creación de conexión desde Visual Studio con el origen de datos a través del asistente.
1. Proceda a iniciar Microsoft Visual Studio desde su computadora. Una vez cargado el IDE en pantalla
procederemos a crear la conexión de tal manera que esta se encuentre activa desde nuestra ventana.
De esta manera se podrá administrar los objetos de bases de datos desde el IDE. Para ello, proceda a
iniciar el explorar de servidores, desde el menú “Ver”, “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 procederemos a
agregar una nueva conexión, para ello proceda a dar clic derecho sobre el icono asociado a servidores
de base datos, automáticamente verá un menú emergente del cual deberá seleccionar la opción de
“Agregar conexión”.
2. Se nos mostrará una ventana 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 de
servidor, seleccione el servidor asociado a su instancia de SQL Server instalada en su computadora.
Para la conexión al servidor se 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
Lenguaje de Programación II
4
Guía #6: Conectando a Fuentes de Datos – Parte III
nos indicara si se ha podido establecer la conexión y si esta ha sido satisfactoria y luego de clic en
Aceptar.
3. 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 derecho sobre la conexión antes establecida y proceda a dar clic en “Propiedades”
del menú emergente. Una vez se carguen las propiedades de la conexión, proceda a copiar la
propiedad “Cadena de conexión” de la ventana de propiedades. Debe conservar los datos en
memoria. Verifique la siguiente imagen.
Lenguaje de Programación II
5
Guía #6: Conectando a Fuentes de Datos – Parte III
4. Ahora, proceda a editar e 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 5. Al final debe
quedarle como se muestra a continuación:
<connectionStrings>
<add name="conexion"
connectionString="Data Source=REEG;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.
5. Una vez creado nuestro sitio web, procederemos a configurar las condiciones de trabajo del mismo
mediante la creación de carpetas y archivos. Para ello cree 4 carpetas en la raíz del sitio según el
detalle de la siguiente tabla. El contenido de cada carpeta se encuentra como recurso de esta guía, por
lo que debe de proceder a adicionar el contenido de cada una de las carpetas como ya lo ha realizado
anteriormente.
Carpeta
css
fonts
images
js
6. Procederemos ahora a crear la lógica de nuestra aplicación, para ello proceda a agregar una nueva
clase con el nombre “conexionDesconetada.cs” que es donde se alojará todo el código que gestionará
los procesos con la base de datos. Proceda a digitar el siguiente código, tomando en cuenta las
instrucciones “using” adicionales que se han cargado:
using
using
using
using
using
using
using
using
System;
System.Collections.Generic;
System.Linq;
System.Web;
System.Data.SqlClient;
System.Configuration;
System.Data;
System.Web.UI.WebControls;
public class conexionDesconetada
{
//Declaramos loss objetos que utilizaremos en toda nuestra clase
string coneccionString;
SqlConnection conexionSQL;
DataSet DataSetPrincipal;
Lenguaje de Programación II
6
Guía #6: Conectando a Fuentes de Datos – Parte III
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();
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 traves 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 dataAdaprte para que funcione como puente entre
dataset y base de datos
SqlDataAdapter dataAdapter = new SqlDataAdapter();
dataAdapter.SelectCommand = new SqlCommand();
dataAdapter.SelectCommand.CommandText = "SELECT * FROM " + nombreTabla;
dataAdapter.SelectCommand.Connection = conexionSQL;
Lenguaje de Programación II
7
Guía #6: Conectando a Fuentes de Datos – Parte III
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();
//Obtenemos la tabla actual y establecemos el campo que se utilizará como llave
primaria
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 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) {
Lenguaje de Programación II
8
Guía #6: Conectando a Fuentes de Datos – Parte III
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
//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";
grid.PagerStyle.CssClass = "pager";
}
public int actualizarProducto(int ProductID, object[] datosActualizados ) {
DataRow fila2Update;
Lenguaje de Programación II
9
Guía #6: Conectando a Fuentes de Datos – Parte III
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;
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;
}
}
}
Lenguaje de Programación II
10
Guía #6: Conectando a Fuentes de Datos – Parte III
7. 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>
<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
<div class="select-wrapper"><asp:DropDownList
ID="ddlCategorias" runat="server"></asp:DropDownList></div>
</div>
<div class="5u 12u$(xsmall)">
Proveedor
Lenguaje de Programación II
11
Guía #6: Conectando a Fuentes de Datos – Parte III
<div class="select-wrapper"><asp:DropDownList
ID="ddlProveedor" runat="server"></asp:DropDownList></div>
</div>
<div class="2u 12u$(xsmall)">
<br />
<asp:Button ID="btnBuscar" runat="server"
Text="Buscar" Width="100%" CssClass="special" />
</div>
<div class="12u 12u$(xsmall)">
<asp:GridView ID="GridView1" Width="100%"
CssClass="alt" runat="server"></asp:GridView>
</div>
</div>
</form>
</section>
</div>
</div>
<!-- Footer -->
<footer id="footer">
<ul class="icons">
<li><a href="#" class="icon
class="label">Twitter</span></a></li>
<li><a href="#" class="icon
class="label">Facebook</span></a></li>
<li><a href="#" class="icon
class="label">Email</span></a></li>
</ul>
<ul class="copyright">
<li>&copy; 2015. All rights
</ul>
</footer>
alt fa-twitter"><span
alt fa-facebook"><span
alt fa-envelope"><span
reserved.</li>
</body>
</html>
8. En la página de código subyacente, agregue una nueva variable de tipo “conexionDesconectada” que
corresponde a la clase que creamos anteriormente. El nombre de la variable debe ser
“nuevaConexion”.
9. 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.
Lenguaje de Programación II
12
Guía #6: Conectando a Fuentes de Datos – Parte III
10. Ahora, procederemos a programar el evento asociado a la paginación del GridView, 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.
11. Ahora, programaremos el evento asociado a los botones de eliminar y editar creados mediante código
y que son añadidos al GridView en uso, para ello, proceda a digitar el siguiente código.
12. Ahora, lo único que nos resta es enlazar dichos eventos con el grid original, para ello, ubíquese en la
página Default.aspx en la vista de código y añada los siguientes atributos AL GRIDVIEW, tal y como
se mostrará 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.
Lenguaje de Programación II
13
Guía #6: Conectando a Fuentes de Datos – Parte III
13. 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.
14. Ahora, cree un nuevo WebForm con el nombre de “EditarRegistro.aspx” y añada el siguiente código.
<%@ 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">
<div class="container">
Lenguaje de Programación II
14
Guía #6: Conectando a Fuentes de Datos – Parte III
<!-- 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>
<div class="6u 12u$(xsmall)">
Proveedor
<div class="select-wrapper"><asp:DropDownList
ID="SupplierID" runat="server"></asp:DropDownList></div>
</div>
<div class="6u 12u$(xsmall)">
Categoría
<div class="select-wrapper"><asp:DropDownList
ID="CategoryID" runat="server"></asp:DropDownList></div>
</div>
<div class="6u 12u$(xsmall)">
<asp:Label runat="server" Text="Cantidad por
Unidad"></asp:Label>
<asp:TextBox ID="QuantityPerUnit"
runat="server"></asp:TextBox>
</div>
<div class="6u 12u$(xsmall)">
<asp:Label runat="server" Text="Precio
Unitario"></asp:Label>
<asp:TextBox ID="UnitPrice"
runat="server"></asp:TextBox>
</div>
<div class="6u 12u$(xsmall)">
<asp:Label runat="server"
Text="Existencias"></asp:Label>
<asp:TextBox ID="UnitsInStock"
runat="server"></asp:TextBox>
</div>
<div class="6u$ 12u$(xsmall)">
<asp:Label runat="server" Text="Unidades
Ordenadas"></asp:Label>
<asp:TextBox ID="UnitsOnOrder"
runat="server"></asp:TextBox>
</div>
<div class="2u 12u$(xsmall)">
<br />
<asp:Button OnClientClick="return confirm('¿Desea
proceder con la actualización del registro?');" ID="btnModificar" runat="server"
Text="Actualizar" Width="100%" CssClass="special" />
</div>
</div>
</section>
</form>
</section>
Lenguaje de Programación II
15
Guía #6: Conectando a Fuentes de Datos – Parte III
</div>
</div>
<!-- Footer -->
<footer id="footer">
<ul class="icons">
<li><a href="#" class="icon
class="label">Twitter</span></a></li>
<li><a href="#" class="icon
class="label">Facebook</span></a></li>
<li><a href="#" class="icon
class="label">Email</span></a></li>
</ul>
<ul class="copyright">
<li>&copy; 2015. All rights
</ul>
</footer>
alt fa-twitter"><span
alt fa-facebook"><span
alt fa-envelope"><span
reserved.</li>
</body>
</html>
15. En la página de código subyacente, agregue una nueva variable de tipo “conexionDesconectada” que
corresponde a la clase que creamos anteriormente. El nombre de la variable debe ser
“nuevaConexion”.
16. 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.
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 de modificar, y luego proceda a digitar el siguiente código.
Lenguaje de Programación II
16
Guía #6: Conectando a Fuentes de Datos – Parte III
18. 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 metodo de actualización de producto de la clase conexionDesconectada.cs y del
siguiente recurso: https://msdn.microsoft.com/es-es/library/5ycd1034.aspx
1.
VI. BIBLIOGRAFÍA
Thierry GROUSSARD. (2013). C# 5: Los fundamentos del lenguaje – Desarrollar con Visual Studio 2012 .
Barcelona: ENI.
Lenguaje de Programación II
17