You are on page 1of 52

________________________________________________

Programa Desarrollador Cinco Estrellas 2005 Estrella 2


________________________________________________

Guia de Ejericicios Aplicaciones Web Forms con ASP.NET

Pgina 1 de 52

ndice
Requisitos ............................................................................................................................ 3 Introduccin.......................................................................................................................... 4 ASP .NET 2.0 Paso a Paso............................................................................................... 5 Grid View.............................................................................................................................. 5 DetailsView ........................................................................................................................ 16 FormView ........................................................................................................................... 24 DataList .............................................................................................................................. 27 Enlazando Datos con Objetos............................................................................................ 30 Enlazando con la capa de acceso a Datos..................................................................... 30 Enlazando a una Clase de Negocios.............................................................................. 39 TREEVIEW + DataAdapter ................................................................................................ 49

Pgina 2 de 52

Requisitos
Haber cursado y aprobado el examen correspondiente al mdulo de la Estrella 1 del programa Desarrollador 5 Estrellas. Haber ledo y comprendido el material terico correspondiente al mdulo de la Estrella 2 del programa. Para la resolucion de los ejercicios debe tener instalado: o MS Visual Studio 2005 / Visual Web Developer 2005 Express Edition. o MS SQL Server 2005 Express Edition. Debe instalar adems las siguientes bases de datos: Northwind (http://www.microsoft.com/downloads/details.aspx?FamilyId=066162120356-46A0-8DA2-EEBC53A68034&displaylang=en ) AdventureWorks (http://www.microsoft.com/downloads/details.aspx?familyid=9697AAAA-AD4B-416E87A4-A8B154F92787&displaylang=en )

Para instalar correctamente la base AdventureWorks se recomienda la lectura del documento titulado SQL Server 2005 Databases and Samples Overview, que acompaa a esta guia. Tambin puede ser descargado de http://download.microsoft.com/download/d/8/6/d865cf0c-c44b-401b-b426b3bf5c628112/SQLServerDatabasesAndSamplesOverview.htm

Pgina 3 de 52

Introduccin
En el presente documento se desarrollan distintos ejercicios Paso a Paso que sirven de complemento al curso Estrella 2 ASP.NET, del programa Desarrollador 5 Estrellas. Los ejercicios aqu desarrollados muestran paso a paso como realizar aplicaciones web simples con acceso a datos, y pueden realizarse en C# y/o VB.NET (hay porciones de cdigo transcriptas, e imgenes que lo guiarn para lograr los objetivos). Se han resuelto algunos de los ejercicios para que el alumno pueda tener el ejemplo del codigo terminado. Los ejercicios resueltos de esta guia paso a paso son: GridView DetailsView Enlazando con la capa de negocios

Todos ellos se encuentran en el proyecto DCE2005 Acceso a Datos, adjunto al material del curso. Tambin se encuentran adjuntas al material otros dos proyectos, uno que ejemplifica la utilizacin de los nuevos controles de login incorporados en ASP.NET 2.0, y otro que muestra la utilizacin de pginas maestras y los nuevos controles de navegacin y men. En el ejercicio de Acceso a Datos se incluyen tambin el nuevo concepto de Themes & Skins, para dar a la aplicacin un aspecto agradable (este nuevo tema esta desarrollado en la presentacin terica).

Pgina 4 de 52

ASP .NET 2.0 Paso a Paso Grid View


Objetivo: Construir un formulario con un control GridView para visualizar, modificar y eliminar datos de la tabla Products de la base de datos Northwind.
NOTA: La serie de pasos utilizada en la resolucin del presente ejercicio no necesariamente refleja las mejores prcticas de Desarrollo y Arquitectura de aplicaciones empresariales establecidas por Microsoft.

1. Abra el Visual Web Developer 2005 Express Edition. Seleccione el men File / New Web Site para crear un nuevo Web Site, segn la siguiente figura. Note que el lenguaje es el Visual Basic, pero si usted desea cambiarlo a Visual C# no hay ningn problema, ya que los pasos son los mismos.

2. Luego presione el botn OK. Se abrir una ventana conteniendo la pgina Default.aspx con el HTML que se mostrar. A los efectos del ejercicio, vamos a crear pginas relativas al tpico abordado, por lo tanto, abra el Solution Explorer (Ctrl + Alt + L) y excluya esta pgina. Para agregar una nueva pgina al Solution Explorer, haga click con el botn derecho sobre C:\WebSite\DCE20005 y seleccione Add New Item. Escriba GridView.aspx en el nombre de la pgina y haga click en Add. Pgina 5 de 52

3. En caso de que quiera escribir los Tags HTML directamente en esta ventana, sintase a gusto, sin embargo, le mostrar los controles en la ventana de Design. Siendo as, haga click en el botn Design en el pie de la pgina.

Pgina 6 de 52

4. Abra la Toolbox y arrastre un control GridView hacia el formulario. Se abrir una Smart Tag conteniendo diversas opciones.

Pgina 7 de 52

5. Seleccione Auto Format y aplique un formato de acuerdo con su gusto.

6. Para definir la fuente de datos, en Choose Data Source seleccione New Data Source.

7. Usted puede seleccionar cualquier fuente de datos, pero en este caso elija Database. Note que ya se define un ID (SqlDataSource1), y en caso de que quiera alterarlo bastar con escribirlo. Como vamos a utilizar esta conexin en varios ejercicios, deje el checkbox de conexin seleccionado para que la string de conexin sea almacenada en el archivo Web.Config.

Pgina 8 de 52

8. Se abrir un wizard por el cual se configura la base de datos y se arma la cadena de conexin, le dejamos ese paso para que lo configure de acuerdo a sus necesidades. 9. Una vez configurada la cadena de conexin necesita identificar cul es la tabla que ser usada como fuente de datos. Seleccione Productos y algunos campos.

Pgina 9 de 52

10. Como permitiremos la edicin de datos en el GridView, haga click en el botn Advanced para abrir esta ventana, donde seleccionar las dos opciones para incluir en el control SqlDataSource todas las instrucciones SQL que hacen efectivas estas operaciones.

Pgina 10 de 52

11. En la Smart Tag se muestran los checkboxes para que active las operaciones. Seleccione: Enable Paging, para permitir la paginacin. Enable Sorting, para permitir el ordenado por columna. Enable Editing, para permitir la edicin de datos directamente en el GridView. Enable Deleting, para permitir la exclusin de datos.

12. Si desea editar las columnas, seleccione Edit Columns. Primero deber des seleccionar el tilde campo Auto generate Columns, y luego aadir las columnas que desee:

Pgina 11 de 52

13. Puede aplicar el formato que desee en los campos, por ejemplo configure el formato en el campo ProductNumber para que sea exhibido como numrico, sin decimales (DataFormatString = {0:n0}). Se puede aplicar cualquier formato a las columnas.

Pgina 12 de 52

14. Como fue permitida la edicin de datos en el control, personalice los botones al idioma en el que el control ser utilizado. Para ello, seleccione el Command Field, localice las propiedades Text de cada botn y modifique el texto.

Pgina 13 de 52

15. Seleccione Auto Format en el Smart Tag, y aplique un formato de acuerdo con su agrado. (en el ejemplo adjunto en el material se utiliza un Theme para la definicin del estilo) 16. Guarde el proyecto y presione CTRL + F5 para ejecutarlo en el navegador. Es importante destacar que el ASP.NET 2.0 no necesita tener un IIS instalado en la mquina, ya que trabaja con su propio servidor web de desarrollo.

Pgina 14 de 52

El cdigo de este ejercicio se encuentra en el ejemplo adjunto DCE2005 Acceso a Datos, en la pgina GridView.aspx, tenga en cuenta que en el ejercicio resuelto se utiliza una Mster Page y Themes para dar un formato y estilo amigable.

Pgina 15 de 52

DetailsView
Objetivo: Construir un formulario con el control DetailsView para visualizar y modificar los registros de la tabla Employes de la base de datos AdventureWorks.
NOTA: La serie de pasos utilizada en la resolucin del presente ejercicio no necesariamente refleja las mejores prcticas de Desarrollo y Arquitectura de aplicaciones empresariales establecidas por Microsoft.

1. Agregue un nuevo Web Form al Solution Explorer, llmelo DetailsView.aspx. 2. Abra la Toolbox y arrastre un control DetailsView hacia el formulario. Se abrir una ventana con la Smart Tag para informar la fuente de datos. Seleccione New data source:

3. Informe cul es la fuente de datos, en este caso es una Database.

Pgina 16 de 52

4. Seleccione la tabla Employees con algunos campos.

Pgina 17 de 52

5. Haga click en el botn Advanced Options y seleccione los dos checkboxes para que sean creados los mtodos para soportar la insercin y edicin de datos.

Pgina 18 de 52

6. Volviendo al Smart Tag, seleccione todos los checkboxes para activar la paginacin y el mantenimiento de datos. 7. .Ingrese a la opcin EditFields y des seleccione la opcin Auto generate columns. Del mismo modo que hizo con la grilla, aada los campos que desee por medio de la opcin Add New Field

8. Personalice el campo Fecha Finalizacin para que quede con el formato de acuerdo con la propiedad DataFormatString, que es {0:dd/MM/yyyy}. El 0: indica que ser el campo actual y el formato viene a continuacin.

Pgina 19 de 52

9. Si analiza el cdigo HTML generado, notar que el contenido de la fuente de datos est declarado dentro del HTML a travs de la Tag asp:SqlDataSource.

Pgina 20 de 52

<form id="form1" runat="server"> <asp:DetailsView ID="DetailsView1" runat="server" AllowPaging="True" AutoGenerateRows="False" BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px" CellPadding="3" CellSpacing="2" DataSourceID="SqlDataSource1" Height="50px" Width="125px"> <FooterStyle BackColor="#F7DFB5" ForeColor="#8C4510" /> <EditRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="White" /> <RowStyle BackColor="#FFF7E7" ForeColor="#8C4510" /> <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" /> <Fields> <asp:CommandField ShowDeleteButton="True" ShowEditButton="True" ShowInsertButton="True" /> <asp:BoundField DataField="ProductId" HeaderText="Codigo" SortExpression="ProductId" /> <asp:BoundField DataField="Name" HeaderText="Nombre" SortExpression="Name" /> <asp:BoundField DataField="ProductNumber" HeaderText="Producto" SortExpression="ProductNumber" /> <asp:BoundField DataField="DaysToManufacture" HeaderText="Demora en Dias" SortExpression="DaysToManufacture" /> <asp:BoundField DataField="ListPrice" HeaderText="Precio" SortExpression="ListPrice" /> <asp:BoundField DataField="DiscontinuedDate" DataFormatString="{0:dd/MM/yyyy}" HeaderText="Fecha Finalizacion" SortExpression="DiscontinuedDate" /> </Fields> <HeaderStyle BackColor="#A55129" Font-Bold="True" ForeColor="White" /> </asp:DetailsView> <asp:SqlDataSource ID="sqlDataSource" runat="server" ConnectionString="<%$ ConnectionStrings:ADVENTUREWORKSConnectionString %>" ConflictDetection="CompareAllValues" SelectCommand="SELECT [ProductID], [Name], [ProductNumber], [Color], [DaysToManufacture], [ListPrice], [DiscontinuedDate] FROM [Production].[Product]" DeleteCommand="DELETE FROM [Production].[Product] WHERE [ProductID] = @original_ProductID AND [Name] = @original_Name AND [ProductNumber] = @original_ProductNumber AND [Color] = @original_Color AND [DaysToManufacture] = @original_DaysToManufacture AND [ListPrice] = @original_ListPrice AND [DiscontinuedDate] = @original_DiscontinuedDate" InsertCommand="INSERT INTO [Production].[Product] ([Name], [ProductNumber], [Color], [DaysToManufacture], [ListPrice], [DiscontinuedDate]) VALUES (@Name, @ProductNumber, @Color, @DaysToManufacture, @ListPrice, @DiscontinuedDate)" OldValuesParameterFormatString="original_{0}" UpdateCommand="UPDATE [Production].[Product] SET [Name] = @Name, [ProductNumber] = @ProductNumber, [Color] = @Color, [DaysToManufacture] = @DaysToManufacture, [ListPrice] = @ListPrice, [DiscontinuedDate] = @DiscontinuedDate WHERE [ProductID] = @original_ProductID AND [Name] = @original_Name AND [ProductNumber] = @original_ProductNumber AND [Color] = @original_Color AND [DaysToManufacture] = @original_DaysToManufacture AND [ListPrice] = @original_ListPrice AND [DiscontinuedDate] = @original_DiscontinuedDate"> <DeleteParameters> <asp:Parameter Name="original_EmployeeID"></asp:Parameter>

Pgina 21 de 52

... <asp:Parameter Name="original_Photo"></asp:Parameter> </DeleteParameters> <UpdateParameters> <asp:Parameter Type="String" Name="LastName"></asp:Parameter> ... <asp:Parameter Name="original_Photo"></asp:Parameter> </UpdateParameters> <InsertParameters> <asp:Parameter Type="String" Name="LastName"></asp:Parameter> ... <asp:Parameter Name="Photo"></asp:Parameter> </InsertParameters> </asp:SqlDataSource> </form>

10. Guarde el proyecto y ejectelo en el navegador. Incluya un nuevo registro y gurdelo. Enseguida, modifique el contenido y guarde nuevamente.

Pgina 22 de 52

El cdigo de este ejercicio se encuentra en el ejemplo adjunto DCE2005 Acceso a Datos, en la pgina DetailsView.aspx. Tenga en cuenta que en el ejercicio resuelto se utiliza una Master Page y Themes para dar un formato y estilo amigable.

Pgina 23 de 52

FormView
Objetivo: Construir un formulario con el control FormView para visualizar los registros de la tabla Customers de la base de datos NorthWind.
NOTA: La serie de pasos utilizada en la resolucin del presente ejercicio no necesariamente refleja las mejores prcticas de Desarrollo y Arquitectura de aplicaciones empresariales establecidas por Microsoft.

1. Agregue un nuevo Web Form en el Solution Explorer. Arrastre el control FormView hacia el formulario.

2. La fuente de datos ser un Database. Seleccione la tabla Customers de la base de datos Northwind y todos los campos.

Pgina 24 de 52

3. Aplique un Auto Format segn la opcin.

4. Ajuste el layout de manera que quepan todos los datos.

Pgina 25 de 52

5. Guarde el proyecto y ejectelo en el navegador. Navegue en las pginas para visualizar los registros.

Pgina 26 de 52

DataList
Objetivo: Construir un formulario con el control DataList. Este control muestra diversos registros en la misma pgina en la que usted debe determinar el rea de datos y el respectivo layout.
NOTA: La serie de pasos utilizada en la resolucin del presente ejercicio no necesariamente refleja las mejores prcticas de Desarrollo y Arquitectura de aplicaciones empresariales establecidas por Microsoft.

1. Agregue un nuevo Web Form al Solution Explorer. Arrastre el control DataList hacia el formulario. Como en los ejercicios anteriores seleccione el DataSource, en este caso seleccione la tabla Orders.

2. Configure con AutoFormat para que el control tenga un aspecto de su agrado.

3. Personalice el campo OrderDate para que la fecha sea mostrada en el formato adecuado. Para ello, seleccione el OrderDateLabel y el enlace Edit DataBindings. Configure el formato para Short Date.

Pgina 27 de 52

4. Note que en el HTML, la propiedad clave para exhibir los datos es la Text donde usa el Eval(field).
<asp:DataList ID="DataList1" Runat="server DataSourceID="SqlDataSource1" RepeatColumns="3"> <ItemTemplate> <b>OrderID: </b> <asp:Label ID="OrderIDLabel" Text='<%# Eval("OrderID") %>'/> OrderDate: <asp:Label ID="OrderDateLabel" Text='<%# Eval("OrderDate", "{0:d}") ... ShipCountry: <asp:Label ID="ShipCountryLabel" Text='<%# Eval("ShipCountry")%>'/> </ItemTemplate> </asp:DataList> <asp:SqlDataSource ID="SqlDataSource1" Runat="server SelectCommand="SELECT [OrderID], [OrderDate], [ShipName], [ShipAddress], [ShipCity], [ShipCountry] FROM [Orders] ConnectionString="<%$ ConnectionStrings:AppConnectionString1 %>"> </asp:SqlDataSource>

Pgina 28 de 52

5. Guarde el proyecto y ejectelo en el navegador.

Pgina 29 de 52

Enlazando Datos con Objetos


Enlazando con la capa de acceso a Datos Objetivo: Definir una clase de de Acceso a Datos (DAL) conteniendo mtodos para acceder a una base de datos que devuelvan un DataSet para enlazar los datos en los controles que sean necesarios.
NOTA: La serie de pasos utilizada en la resolucin del presente ejercicio no necesariamente refleja las mejores prcticas de Desarrollo y Arquitectura de aplicaciones empresariales establecidas por Microsoft.

1. En el Solution Explorer, agregue un nuevo proyecto tipo Class Library llamado DataAccess. 2. Como accederemos al SQL Server, en la primera lnea de la pantalla escriba los Namespaces que contienen los mtodos y propiedades para efectuar el acceso. En este caso, el namespace que contiene la clase SqlClient, la cual fue creada para manipular datos con SQL Server 7 o superior.
VB.NET Imports System.Data Imports System.Data.SqlClient C# using System.Data; using System.Data.SqlClient;

3. Escriba el mtodo llamado GetCategories que devuelve un DataSet. Este mtodo: utilizar el string de conexin llamado myConn que est almacenado en el archivo Web.Config; define una instruccin SQL que selecciona todos los campos de la tabla Categories; define la conexin y el Command que implementa el Select; crea un DataAdapter y un DataSet; completa el DataAdapter en el respectivo DataSet definido y lo devuelve. Mientras tanto, el mtodo GetProducts recibe como argumento el cdigo de la categora y devuelve un Dataset con los productos de esa categora. Pgina 30 de 52

Este cdigo ser usado como criterio en la instruccin SQL para investigar todos los productos de la respectiva categora:
VB.NET Public Class DataAccess Public Shared Function GetCategories() As DataSet Dim conexion As String = ConfigurationSettings.ConnectionStrings(myConn").ConnectionString() Dim sql As String = "SELECT * FROM Categories" Dim conn As New SqlConnection(conexion) Dim command As New SqlCommand(sql, conn) Dim adapter As New SqlDataAdapter(command) Dim ds As New DataSet adapter.Fill(ds) Return ds End Function

Public Shared Function GetProducts(ByVal cat As Integer) As DataSet Dim conexion As String = ConfigurationSettings.ConnectionStrings(myConn").ConnectionString() Dim conn As New SqlConnection(conexion) Dim command As New SqlCommand() command.Connection = conn command.CommandType = CommandType.Text command.Parameters.Add(New SqlParameter("@cat", cat)) command.CommandText = "SELECT ProductID, ProductName, UnitPrice, UnitsInStock FROM Products WHERE categoryID=@cat" Dim adapter As New SqlDataAdapter(command) Dim ds As New DataSet adapter.Fill(ds)

Pgina 31 de 52

Return ds End Function End Class

C# public class DataAccess { public static DataSet GetCategories() { string conexion = "Database=northwind;server=(local);user id=sa "; string sql = "SELECT * FROM Categories"; SqlConnection conn = new SqlConnection(conexion); SqlCommand command = new SqlCommand(sql, conn);

SqlDataAdapter adapter = new SqlDataAdapter(command); DataSet ds = new DataSet(); adapter.Fill(ds); return ds; } public static DataSet GetProducts(int cat) { string conexion = "Database=northwind;server=(local);user id=sa"; SqlConnection conn = new SqlConnection(conexion); SqlCommand command = new SqlCommand(); command.Connection = conn; command.CommandType = CommandType.Text; command.Parameters.Add(new SqlParameter("@cat", cat)); command.CommandText = "SELECT ProductID, ProductName, UnitPrice, UnitsInStock FROM Products WHERE categoryID=@cat";

Pgina 32 de 52

SqlDataAdapter adapter = new SqlDataAdapter(command); DataSet ds = new DataSet(); adapter.Fill(ds); return ds; } }

4. Guarde el proyecto. Agregue un nuevo Web Form en el Solution Explorer. Escriba Categoras y arrastre el control DropDownList hacia el formulario. En la Smart Tag, seleccione el checkbox AutoPostBack para enviar el contenido de este control al servidor.

5. Para la fuente de datos seleccione Object, ya que usaremos la clase definida anteriormente. En caso de que desee alterar el nombre del DataSource, sintase libre de hacerlo.

Pgina 33 de 52

6. En el Tab Select se muestran todos los mtodos existentes. Seleccione el GetCategories y observe que el tipo de retorno es un DataSet.

Pgina 34 de 52

7. Como el control es un DropDownList, escriba CategoryName en Data Field to Display, porque es aqu que el campo ser exhibido. Por otra parta, el Data Field for the Value es el campo que ser almacenado cuando el usuario seleccione un tem, por lo tanto escriba CategoryID.

8. A continuacin Construiremos en el formulario un GridView para mostrar todos los productos de la respectiva categora. Seleccione como Data Source el Object DataAccess y el mtodo GetProducts.

Pgina 35 de 52

9. Como este mtodo requiere un parmetro, hay que especificar que vendr del control DropDownList1, para esto seleccione en el combo ParameterSource la opcin Control, y seleccione en el combo ControlId, el control que corresponda.

Pgina 36 de 52

10. En la Smart Tag, habilite la paginacin y el ordenamiento, y configure el formato para la grilla que sea de su agrado.

Pgina 37 de 52

11. Guarde el proyecto y ejectelo en el navegador. Seleccione otras categoras y vea que el GridView muestra todos los productos de la categora seleccionada.

Pgina 38 de 52

Enlazando a una Clase de Negocios Objetivo: Obtener los departamentos de la base de datos AdventureWorks segn el grupo solicitado por el cliente (se utilizar la tabla Department). Definir un componente de negocios que implemente reglas a los datos obtenidos del componente de acceso a datos. Implementar el componente dentro de la carpeta virtual App_Code.
NOTA: La serie de pasos utilizada en la resolucin del presente ejercicio no necesariamente refleja las mejores prcticas de Desarrollo y Arquitectura de aplicaciones empresariales establecidas por Microsoft.

1. En el Solution Explorer, con el botn derecho del Mouse sobre el proyecto agregue la carpeta virtual App_Code:

Pgina 39 de 52

2. Dentro de la carpeta generada, incorpore tres clases: AccesoDatos.cs, CapaDeNegocio.cs y Departamento.cs. Veamos primero la clase de acceso a datos:
//Se incluyen las referencias necesarias, adems de las de acceso a //datos y Sql, los namespaces using System.Collections.Generic y //using System.Text sern utilizados para poder utilizar una lista //generica para la devolucion de datos y un contructor de cadenas para //crear la cadena de consultas. VB.NET Imports System.Data Imports System.Data.SqlClient Imports System.Collections.Generic Imports System.Text C# using System.Data; using System.Collections.Generic; using System.Text; using System.Data.SqlClient;

3. En esta clase que simula el componente de acceso a datos, hay que incorporar un mtodo que devuelva los Departamentos por grupos, de acuerdo al requisito. La clase completa se encuentra en el proyecto DCE2005 Acceso a Datos, que tambin posee un mtodo para devolver los grupos en que se dividen los departamentos.
VB.NET Public Function ObtenerDepartamentos(ByVal grupo As String) As List(Of Departamento) Dim departamentos As List(Of Departamento) = New List(Of Departamento) Dim query As StringBuilder = New StringBuilder query.Append("SELECT ") query.Append("DepartmentID, ") query.Append("Name, ") query.Append("ModifiedDate ") query.Append("FROM [HumanResources].[Department] ") query.AppendFormat("WHERE GroupName = '{0}' ", grupo) query.Append("Order By Name") Dim command As SqlCommand = New SqlCommand command.CommandText = query.ToString

Pgina 40 de 52

Dim conn As SqlConnection = New SqlConnection(ConfigurationManager.ConnectionStrings("ADVENTUREWORKSConnectionSt ring").ConnectionString) command.Connection = conn Try conn.Open() ' Using Dim dr As SqlDataReader = command.ExecuteReader Try If dr.HasRows Then While dr.Read Dim dep As Departamento = New Departamento(Convert.ToInt32(dr(0)), dr(1).ToString, grupo, Convert.ToDateTime(dr(2))) departamentos.Add(dep) End While End If Finally CType(dr, IDisposable).Dispose() End Try Catch ex As Exception Throw ex Finally conn.Close() End Try Return departamentos End Function

Pgina 41 de 52

C# /// <summary> /// Este metodo obtiene los departamentos por grupos. /// </summary> /// <param name="grupo">El grupo seleccionado del combo</param> /// <returns>Una lista de departamentos.</returns> public List<Departamento> ObtenerDepartamentos(string grupo) { List<Departamento> departamentos = new List<Departamento>(); StringBuilder query = new StringBuilder(); query.Append("SELECT "); query.Append("DepartmentID, "); query.Append("Name, "); query.Append("ModifiedDate "); query.Append("FROM [HumanResources].[Department] "); query.AppendFormat("WHERE GroupName = '{0}' ", grupo); query.Append("Order By Name"); SqlCommand command = new SqlCommand(); command.CommandText = query.ToString(); SqlConnection conn = new SqlConnection( ConfigurationManager.ConnectionStrings[ "ADVENTUREWORKSConnectionString" ].ConnectionString); command.Connection = conn; try { conn.Open(); using (SqlDataReader dr = command.ExecuteReader()) { if (dr.HasRows) { while(dr.Read()) { Departamento dep = new Departamento( Convert.ToInt32( dr[0]), dr[1].ToString(), grupo , Convert.ToDateTime(dr[2]) ); departamentos.Add(dep); } } } } catch (Exception ex) { throw ex; } finally { conn.Close(); } return departamentos; } }

Pgina 42 de 52

4. Otra clase necesaria, para poder desarrollar el mtodo anterior es la clase Departamento.cs, esta clase contendr las propiedades y mtodos necesarios para crear el objeto Departamento con que se llenar la lista. Puede ver esta clase en el proyecto DCE2005 Acceso a Datos. 5. Por ltimo, la clase CapaDeNegocios, simula un componente de negocios, en este caso y para simplificar el ejemplo, no se aplican reglas de validacin, o propias del negocio, solo se invocan los mtodos del componente de acceso a datos. Los accesos se realizan por medio de la clase AccesoDatos.cs, que simula una capa de datos, y utiliza la clase Departamento, ya que es con objetos de este tipo en los que se basa el ejercicio. Los mtodos ms importantes de la capa de negocios, contra los que se enlazaran los datos en los controles son los siguientes:
VB.NET Public Function ObtenerDepartamentosPorGrupo(ByVal grupo As String) As List( of Departamento) 'Definir y agregar las reglas de negocio Dim ad As AccesoDatos = New AccesoDatos Return ad.ObtenerDepartamentos(grupo) End Function C# public List<Departamento> ObtenerDepartamentosPorGrupo(string grupo) { //Definir y agregar reglas de negocio AccesoDatos ad = new AccesoDatos(); return ad.ObtenerDepartamentos(grupo); }

6. Una vez armadas las 3 clases, agregue un nuevo Web Form en el Solution Explorer y llmelo BindingToBusinessLayer. Con ASP.NET 2.0 puede tambin arrastrar y pegar los controles en la solapa Source, entonces, desde la solapa Source incorpore un control Label, un control DropDownList y un control GridView. En el ejercicio resuelto, se esta trabajando con una pgina maestra y temas, para mantener una interfaz uniforme, adems previamente a la incorporacin de los controles se incorporo una tabla de html para darle la estructura a la pgina. En la porcin de cdigo copiada aqu, no se incluyen comentarios. Para ver la versin completa con comentarios, vea el ejercicio DCE2005 Acceso a Datos, la clase BindingToBusinessLayer.aspx

Pgina 43 de 52

Con la utilizacin del tema a nivel de aplicacin, el cdigo html queda ms limpio, ya que no es necesario incluir propiedades de estilo (y comportamiento) en el html:
ASP .NET <table> <tr> <td> <asp:Label ID="lblGrupo" runat="server" CssClass="Label" > Seleccione un grupo:</asp:Label> </td> <td align=left width="83%"> <asp:DropDownList ID="cmbGrupos" runat="server" CssClass="Text" DataSourceID="dsGrupos" AutoPostBack="true"> </asp:DropDownList><br /> </td> </tr> <tr height="50px"><td></td></tr> <tr> <td colspan="2" align=center> <asp:GridView ID="drDepartamentos" runat="server" DataSourceID="dsDepartamentos" AutoGenerateColumns="false"> <Columns> <asp:BoundField HeaderText="Codigo" DataField="DepartamentoID" ItemStyle-HorizontalAlign="right" /> <asp:BoundField HeaderText="Departamento" DataField="Nombre" ItemStyle-HorizontalAlign="Left" /> <asp:BoundField HeaderText="Grupo" DataField="Grupo" ItemStyle-HorizontalAlign="Left" /> <asp:BoundField HeaderText="Fecha" DataField="FechaModificacion" ItemStyle-HorizontalAlign="right" /> </Columns> </asp:GridView> </td> </tr> </table>

Observe que al no permitir que la grilla auto genere las columnas (propiedad: AutoGenerateColumns="false"), hay que definir explcitamente cada columna a mostrar. La propiedad DataField, hace referencia al campo que devuelve la consulta a la base de datos, enlazando la informacin a mostrar en cada columna. 7. Las fuentes de datos utilizadas en el ejercicio, fueron incorporadas del ToolBox, y configuradas como sigue:
ASP .NET

Pgina 44 de 52

<!--Control Datasource para llenar la grilla de departamentos. Mediante el parametro se indica la relacion entre el combo y la grilla--> <asp:ObjectDataSource ID="dsDepartamentos" runat=server TypeName="Departamentos.CapaDeNegocio" SelectMethod="ObtenerDepartamentosPorGrupo" DataObjectTypeName="Departamentos.Departamento"> <SelectParameters> <asp:ControlParameter DefaultValue="Quality Assurance" Name="grupo" Type="String" ControlID="cmbGrupos" PropertyName="SelectedValue" /> </SelectParameters> </asp:ObjectDataSource> <!-- Control Datasource para llenar el combo de grupos --> <asp:ObjectDataSource ID="dsGrupos" runat="server" TypeName="Departamentos.CapaDeNegocio" SelectMethod="ObtenerGrupos"> </asp:ObjectDataSource>

8. Puede ver el cdigo completo en el ejercicio antes mencionado, el resultado es el siguiente:

Tenga en cuenta que en la vista de diseo, mediante el smart tag puede configurar el control ObjectDataSource seleccionando la clase de la capa de negocios, y los mtodos para realizar el enlace de datos a los controles, de manera similar al ejercicio anterior.

Pgina 45 de 52

TREEVIEW + XML
Objetivo: Definir un archivo XML y utilizarlo como fuente de datos para un control TreeView.
NOTA: La serie de pasos utilizada en la resolucin del presente ejercicio no necesariamente refleja las mejores prcticas de Desarrollo y Arquitectura de aplicaciones empresariales establecidas por Microsoft.

1. En el Solution Explorer, agregue un nuevo tem de tipo XML File llamado myXML con la siguiente estructura.
<?xml version="1.0" encoding="utf-8" ?> <collection> <book> <title>asp.NET</title> <author>dino esposito</author> <publisher>ms press</publisher> </book> <book> <title>sql reporting services</title> <author>tom cruise</author> <publisher>ms press</publisher> </book> </collection>

2. Agregue un nuevo Web Form. Arrastre el control TreeView hacia el formulario y asocie como fuente de datos el archivo XML creado anteriormente.

Pgina 46 de 52

3. Defina un Auto Format segn la opcin para presentar los datos jerrquicos de manera viable.

Pgina 47 de 52

Pgina 48 de 52

TREEVIEW + DataAdapter
Objetivo: Escribir un cdigo que leer una tabla en el banco de datos, Construir un DataAdapter y completar un control TreeView.
NOTA: La serie de pasos utilizada en la resolucin del presente ejercicio no necesariamente refleja las mejores prcticas de Desarrollo y Arquitectura de aplicaciones empresariales establecidas por Microsoft.

1. En el Solution Explorer, Agregue un nuevo formulario conteniendo un control TreeView. Como escribiremos el cdigo directamente en el HTML, en el pie de pgina, haga click en el botn HTML y escriba el siguiente cdigo que leer dos tablas (Categories y Products) de la base de datos Northwind, construir en memoria una relacin entre las claves y lo usar como fuente de datos para construir el control TreeView. Como este control requiere datos jerrquicos, entonces construiremos un nivel con las categoras y otro nivel con los productos de las respectivas categoras.
VB.NET <%@ Page Language="VB" %> <%@ Import Namespace="System.Data" %> <%@ Import Namespace="System.Data.SqlClient" %>

<script runat="server"> Dim conexao As String = "Server=localhost;Database=Northwind;user id=sa"

Sub Page_Load() If Not Page.IsPostBack Then FillNodes() End If End Sub

Sub FillNodes() Dim ds As DataSet = GetData() For Each masterRow As DataRow In ds.Tables("Categories").Rows Dim masterNode As New TreeNode(masterRow("CategoryName").ToString())

Pgina 49 de 52

TreeView1.Nodes.Add(masterNode) For Each childRow As DataRow In masterRow.GetChildRows("Children") Dim childNode As New TreeNode(childRow("ProductName").ToString()) masterNode.ChildNodes.Add(childNode) Next Next End Sub

Function GetData() As DataSet Dim conn As SqlConnection = New SqlConnection(conexao) Dim sqlCat As String = "SELECT CategoryID, CategoryName FROM Categories" Dim sqlProd As String = "SELECT CategoryID, ProductName FROM Products" Dim daCat As SqlDataAdapter = New SqlDataAdapter(sqlCat, conn) Dim daProd As SqlDataAdapter = New SqlDataAdapter(sqlProd, conn) Dim ds As DataSet = New DataSet() daCat.Fill(ds, "Categories") daProd.Fill(ds, "Products") ds.Relations.Add("Children", _ ds.Tables("Categories").Columns("CategoryID"), _ ds.Tables("Products").Columns("CategoryID")) Return ds End Function

</script>

C# <%@ Page Language="C#" %>

Pgina 50 de 52

<%@ Import Namespace="System.Data" %> <%@ Import Namespace="System.Data.SqlClient" %>

<script runat="server"> const string connString = "Server=localhost;Database=Northwind;user id=sa"; void Page_Load() { if (! Page.IsPostBack) FillNodes(); }

void FillNodes() { DataSet dst = GetData(); foreach (DataRow masterRow in dst.Tables["Categories"].Rows) { TreeNode masterNode = new TreeNode((string)masterRow["CategoryName"]); TreeView1.Nodes.Add(masterNode); foreach (DataRow childRow in masterRow.GetChildRows("Children")) { TreeNode childNode = new TreeNode((string)childRow["ProductName"]); masterNode.ChildNodes.Add(childNode); } } }

DataSet GetData()

Pgina 51 de 52

{ SqlConnection conn = new SqlConnection(connString); string sqlCat = "Select CategoryID, CategoryName FROM Categories"; string sqlProd = "Select CategoryID, ProductName FROM Products"; SqlDataAdapter daCat = new SqlDataAdapter(sqlCat, conn); SqlDataAdapter daProd = new SqlDataAdapter(sqlProd, conn); DataSet ds = new DataSet(); daCat.Fill(ds, "Categories"); daProd.Fill(ds, "Products"); ds.Relations.Add("Children", ds.Tables["Categories"].Columns["CategoryID"], ds.Tables["Products"].Columns["CategoryID"]); return ds; } </script>

Pgina 52 de 52