LENGUAJE DE PROGRAMACIN III

49

UNIDAD DE
APRENDIZAJE

1
SEMANA

3
ADMINISTRANDO LOS ESTADOS
Y DISEANDO UNA APLICACIN
WEB
LOGRO DE LA UNIDAD DE APRENDIZAJE
Al trmino de la unidad, los alumnos, utilizando las tcnicas explicadas en clase y los
controles que proporciona el Framework 3.5, construyen el diseo de pginas Web
para personalizar el diseo y apariencia de una pgina Web.

TEMARIO

Tipos de Web Site en Visual Studio 2008

Gestin de Web Form
Tipos de programacin :Script y Code-Behind
Manejo de controles estndar de Servidor: Implementacin, configuracin y
programacin
Manejo de controles de validacin: RequiredFieldValidator, CompareValidator,
RegularExpressionValidator, CustomValidator, RangeValidator
Trabajar con objetos intrnsecos de [Link]: Request, Response, Server,
ViewState, Cookies, Session, Application
Diseo e implementacin de una pgina web: Hojas de estilo, temas, master
page, App_Themes, StyleSheetTheme

ACTIVIDADES PROPUESTAS

Los alumnos manejan los estados de una pgina: Cookies, ViewState, Application y
Session.
Los alumnos disean un master page, definen hojas de estilos y temas para
implementar un sitio Web

CIBERTEC

CARRERAS PROFESIONALES

50

1. INFORMACIN GENERAL SOBRE LA ADMINISTRACIN DE

ESTADOS EN ASP .NET
Cada vez que la pgina se enva al servidor, se crea una nueva instancia de la
clase de la pgina Web. En la programacin Web tradicional, esto se traduce en
que toda la informacin asociada a la pgina y sus controles se pierden con cada
recorrido de ida y vuelta.
Para superar esta limitacin inherente de la programacin Web tradicional,
[Link] incluye varias opciones que ayudan a preservar los datos en cada
pgina y en toda la aplicacin. Estas caractersticas son las siguientes:

Estado de vista
Estado de control
Campos ocultos
Cookies
Cadenas de consulta
Estado de aplicacin
Estado de sesin
Propiedades de perfiles

1.1 OPCIONES DE ADMINISTRACIN DE ESTADO EN EL CLIENTE

Las siguientes secciones describen opciones para administrar el estado que

almacenan la informacin en la pgina o en el equipo cliente.
1.1.1 Estado de vista: ViewState
Permite conservar valores entre las distintas solicitudes de una misma
pgina. ste es el mtodo predeterminado que la pgina utiliza para
conservar los valores de las propiedades de la propia pgina y sus
controles entre recorridos de ida y vuelta.

1.1.2 Estado de control: ControlState

La propiedad ControlState permite mantener la informacin de las
propiedades que es especfica de un control y que no se puede
desactivar como ocurre con la propiedad ViewState. Por ejemplo, si ha
escrito un control personalizado con varias fichas que muestran distintos
tipos de informacin, el control debe saber la ficha que se selecciona en
los recorridos de ida y vuelta para que funcione tal y como se espera.
1.1.3 Campos ocultos: HiddenField
Un control HiddenField almacena una nica variable en su propiedad
Value y se debe agregar en la pgina de forma explcita.
Para que los valores de los campos ocultos estn disponibles durante el
procesamiento de la pgina, debe enviarla mediante el mtodo POST
de HTTP. Si utiliza campos ocultos y una pgina se procesa como
respuesta a un vnculo o a un comando GET de HTTP, los campos
ocultos no estarn disponibles.
1.1.4 Cookies
Una cookie es una cantidad pequea de datos que se almacena en un
archivo de texto en el sistema de archivos del cliente o que se mantiene
en la memoria durante la sesin del explorador cliente. Contiene
informacin especfica del sitio que el servidor enva al cliente junto con
el resultado de la pgina.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

51

1.1.5 Cadenas de consulta: QueryString

Una cadena de consulta es informacin que se anexa al final de la
direccin URL de una pgina. Un ejemplo tpico de cadena de consulta:
[Link]
En la ruta URL indicada, la cadena de consulta empieza por un signo de
interrogacin (?) e incluye dos pares de atributo-valor, uno de ellos se
denomina "category" y el otro, "price".
Para que los valores de las cadenas de consulta estn disponibles
durante el procesamiento de la pgina, debe utilizar el mtodo GET de
HTTP.

1.2 OPCIONES DE ADMINISTRACIN DE ESTADO EN EL SERVIDOR

[Link] proporciona una serie de medios para mantener la informacin de

estado en el servidor, en lugar de conservarla en el cliente. Con la
administracin de estados basada en servidor, puede reducir la cantidad de
informacin que se enva al cliente para conservar el estado.
1.2.1 Estado de aplicacin: ApplicationState
El estado de aplicacin es un mecanismo de almacenamiento global al
que se puede obtener acceso desde todas las pginas de la aplicacin
Web.
Es una instancia de la clase HttpApplicationState, de cada aplicacin
Web activa. Por tanto, el estado de aplicacin resulta til para
almacenar la informacin que se debe mantener en los recorridos de ida
y vuelta del servidor y entre las solicitudes de las pginas.
1.2.2 Estado de sesin: SessionState
Estado de sesin es similar a estado de aplicacin con la diferencia de
que el mbito es la actual sesin del explorador. Si hay varios usuarios
utilizando la aplicacin, cada uno de ellos tendr un estado de sesin
distinto.

2. INFORMACIN GENERAL SOBRE LAS COOKIES

Las cookies son pequeos fragmentos de texto que acompaa a las solicitudes y
a las pginas mientras stas se transmiten del servidor Web al explorador y
viceversa. Permiten a los sitios Web almacenar informacin sobre los visitantes.
Se utilizan para muchos propsitos; todos ellos destinados a facilitar al sitio Web
el reconocimiento de los usuarios. Por ejemplo, un sitio que lleva a cabo un
sondeo podra utilizar una cookie, simplemente, como un valor booleano para
indicar si el explorador del usuario ya ha participado en la votacin con el fin de
evitar que el usuario vote dos veces.
La mayora de los exploradores admiten cookies de un tamao mximo de 4096
bytes. Los exploradores tambin imponen limitaciones: slo permiten 20 cookies
por sitio; si se intenta almacenar ms, las cookies ms antiguas se descartan.

2.1 MODO DE ESCRIBIR COOKIES

El explorador administra las cookies en los equipos de los clientes. Las

cookies se envan al cliente utilizando el objeto HttpResponse, que expone
una propiedad denominada Cookies.
Cuando escriba una nueva cookie, deber especificar sus propiedades Name
y Value. Cada cookie debe tener un nombre nico para que la aplicacin Web
pueda identificarla cuando el explorador la enve con solicitudes futuras.

CIBERTEC

CARRERAS PROFESIONALES

52

Hay dos maneras de escribir una cookie en el equipo de un usuario:

Establecer las propiedades de la cookie directamente en la coleccin Cookies
[Link]("userName").Value = "patrick"
[Link]("userName").Expires = [Link](1)
Crear una instancia del objeto HttpCookie y agregarla a la coleccin Cookies.
Dim aCookie As New HttpCookie("lastVisit")
[Link] = [Link]()
[Link] = [Link](1)
[Link](aCookie)

Las cookies tambin pueden almacenar varios pares de nombre y valor en

una sola cookie.
En el ejemplo siguiente se muestra la manera de escribir la misma
cookie, cada una con dos subclaves:
Dim aCookie As New HttpCookie("userInfo")
[Link]("userName") = "patrick"
[Link]("lastVisit") = [Link]()
[Link] = [Link](1)
[Link](aCookie)

Para limitar las cookies a una carpeta del servidor, establezca la

propiedad Path de la cookie, como en el ejemplo siguiente:
Dim appCookie As New HttpCookie("AppCookie")
[Link] = "written " & [Link]()
[Link] = [Link](1)
[Link] = "/Application1"
[Link](appCookie)

2.2 MODO DE LEER LAS COOKIES

En sus aplicaciones [Link], puede leer las cookies mediante el objeto
HttpRequest, que est disponible como propiedad Request de la clase
Page. En el ejemplo, se muestran dos maneras de obtener el valor de una
cookie denominada username
If Not [Link]("userName") Is Nothing Then
Dim aCookie As HttpCookie = [Link]("userName")
[Link] = [Link]([Link])
End If
Para leer los nombres y los valores de todas las cookies disponibles
para la pgina, puede recorrer la coleccin Cookies mediante cdigo
como el siguiente.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

53

Dim output As [Link] = New [Link]

Dim aCookie As HttpCookie
For i as Integer= 0 to [Link] - 1
aCookie = [Link](i)
[Link]("<br/>")
[Link]("Name=" & [Link]([Link]) & "<br />")
[Link]("Value=" & [Link]([Link]) & "<br />")
Next
[Link] = [Link]()

2.3 ELIMINACIN DE LAS COOKIES

La eliminacin de una cookie, es decir, su borrado fsico del disco duro del
usuario, es una variacin del proceso de modificacin. No es posible
eliminar directamente una cookie, ya que se encuentra en el equipo del
usuario. Sin embargo, puede conseguir que el explorador la elimine.
Dim aCookie As HttpCookie
Dim cookieName As String
Dim limit As Integer = [Link] - 1
For i as Integer=0 To limit
cookieName = [Link](i).Name
aCookie = New HttpCookie(cookieName)
[Link] = [Link](-1)
[Link](aCookie)
Next

3. INFORMACIN GENERAL SOBRE EL ESTADO DE VISTA

El estado de vista es el mtodo que permite conservar los valores de pgina y
control entre acciones de ida y vuelta. Puede tener acceso al estado de vista en
su propio cdigo mediante la propiedad ViewState de la pgina para conservar
los datos durante las acciones de ida y vuelta al servidor Web.

3.1 MODO DE GUARDAR VALORES EN EL ESTADO DE VISTA

El estado de vista es un repositorio de una pgina [Link] en el que se
pueden almacenar valores que deben conservarse durante la devolucin de
datos.
Los datos de estado de vista se almacenan en uno o ms campos ocultos
como cadenas codificadas en base64. Puede tener acceso a informacin de
estado de vista mediante la propiedad ViewState de la pgina que expone un
objeto de diccionario. Puesto que el estado de vista se enva como un campo
oculto, se pueden realizar cambios en el estado hasta el evento PreRender.
3.1.1 Para guardar un valor en el estado de vista:
Sub Page_PreRender(ByVal sender As Object, ByVal e As EventArgs)
[Link]("arrayListInViewState", PageArrayList)
End Sub

CIBERTEC

CARRERAS PROFESIONALES

54

3.1.2 Para cifrar el estado de vista:

En la directiva @Page, establezca el atributo ViewStateEncryptionMode
en "Always", como en el ejemplo siguiente:
<% @Page ViewStateEncryptionMode="Always" ... %>
3.2 MODO DE HABILITAR O DESHABILITAR EL VIEWSTATE PARA UN
CONTROL O PGINA
Para habilitar o deshabilitar el estado de vista para un control:
Seleccione el control en la vista diseo del Web form.
En la ventana de propiedad, seleccione la propiedad EnabledViewState
y seleccione el valor de true para habilitar el estado; seleccione false
para deshabilitar el estado de la vista del control
Para habilitar o deshabilitar el estado de vista de una pgina:
Seleccione la vista de origen (Source View) de la pgina Web.
Ubique la directiva <% @Page %>
Para
habilitar
el
ViewState,
aada
a
la
directiva
EnabledViewState=true; para deshabilitar el ViewState, a la
directiva EnabledViewState=false.

4. INFORMACIN GENERAL SOBRE EL ESTADO DE SESSION

El estado de sesin de [Link] identifica las solicitudes recibidas desde el
mismo explorador durante un tiempo limitado como una sesin y conserva los
valores de las variables mientras dure esa sesin.
Por ejemplo, crear las variables de sesin FirstName y LastName para
representar el nombre y el apellido de un usuario y las variables se
establecen en los valores recuperados de los controles
Session("FirstName") = [Link]
Session("LastName") = [Link]

4.1 EVENTOS DEL ESTADO DE SESSION

[Link] proporciona dos eventos que ayudan a administrar las sesiones de
usuario: Session_OnStart se desencadena cuando inicia una nueva sesin,
y Session_OnEnd se desencadena cuando se abandona una sesin.
4.1.1 Session_OnStart
Se ejecuta al principio de una solicitud, si sta inicia una nueva sesin.
Se utiliza para inicializar las variables de sesin, as como para realizar
el seguimiento de la informacin relacionada con la sesin.
4.1.2 Session_OnEnd
Se ejecuta cuando se llama al mtodo Abandon o cuando la sesin ha
caducado. Una sesin caduca cuando el nmero de minutos
especificado por la propiedad Timeout transcurre sin que se haya
creado ninguna solicitud para la sesin.
Si la propiedad Mode del objeto Session es StateServer o SQLServer,
se omite el evento Session_OnEnd en el archivo [Link]. Puede
utilizar el evento Session_OnEnd para limpiar la informacin
relacionada con la sesin.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

55

Ejemplo de eventos de session

Las subrutinas definidas en este ejemplo crean un contador que
realiza el seguimiento del nmero de usuarios de la aplicacin que
utilizan dicha aplicacin de forma activa. Observe que este ejemplo
slo funcionar correctamente cuando la propiedad de estado de sesin
Mode se establezca en InProc, ya que el evento Session_OnEnd slo es
compatible con el almacn de estado de sesin en proceso.
<script language="VB" runat="server">
Public Sub Application_OnStart()
Application("UsersOnline") = 0
End Sub
Public Sub Session_OnStart()
[Link]()
Application("UsersOnline") = CInt(Application("UsersOnline")) + 1
[Link]()
End Sub
Public Sub Session_OnEnd()
[Link]()
Application("UsersOnline") = CInt(Application("UsersOnline")) - 1
[Link]()
End Sub
</script>

4.2 RECUPERAR LOS VALORES EN UN ESTADO DE SESSION

La propiedad tem permite recuperar los valores de un estado de sesin.
Dim firstName as String = CType([Link]("FirstName"), String)
Dim lastName as String = CType([Link]("LastName"), String)
El estado de la sesin caduca, de forma predeterminada, despus de 20
minutos de inactividad. Puede controlar el perodo de duracin del estado de
sesin mediante el atributo timeout de la seccin de configuracin
sessionState.

4.3 MODOS DE UN ESTADO DE SESSION

El estado de sesin de [Link] es compatible con distintas opciones de
almacenamiento de los datos de la sesin. En la lista siguiente se describen
los modos de estado de sesin disponibles:
Modo InProc, que almacena el estado de sesin en memoria en el servidor
Web. ste es el valor predeterminado.
Modo StateServer, que almacena el estado de sesin en un proceso
distinto denominado "servicio de estado de [Link]". Este modo
garantiza que el estado de sesin se mantiene si se reinicia la aplicacin
Web y que est disponible tambin para varios servidores Web.
Modo SQLServer, que almacena el estado de sesin en una base de
datos de SQL Server. Este modo garantiza que el estado de sesin se
mantiene si se reinicia la aplicacin Web y que est disponible tambin
para varios servidores Web en una batera de servidores Web.
Modo Custom, que permite especificar un proveedor de almacenamiento
personalizado.

CIBERTEC

CARRERAS PROFESIONALES

56

5. INFORMACIN GENERAL SOBRE EL ESTADO DE

APLICACION
El estado de aplicacin es un repositorio de datos disponible para todas las clases
de una aplicacin [Link]. El estado de aplicacin se almacena en la memoria
del servidor y ofrece ms rapidez que el almacenamiento y la recuperacin de
informacin de una base de datos.
El estado de aplicacin se almacena en una instancia de la clase
HttpApplicationState. Esta expone un diccionario de objetos con valores y
claves. La instancia de HttpApplicationState se crea la primera vez que el
usuario tiene acceso a cualquier recurso de direccin URL de la aplicacin.

5.1 MODO DE GUARDAR VALORES EN UN ESTADO DE APLICACIN

El estado de aplicacin se almacena en la memoria del servidor, por lo que

una cantidad grande de datos puede llenarla rpidamente. Si se reinicia la
aplicacin, los datos de estado de aplicacin se pierden.
5.1.1 Modo de escribir un valor en el estado de aplicacin
Establezca el valor de la variable en la clase HttpApplicationState, en
el controlador Application_Start del archivo [Link]
En el ejemplo de cdigo siguiente, se muestra cmo establecer la
variable de aplicacin Message en una cadena.
Application("Message") = "Bienvenido al Portal Cibertec"
Application("Count") = 0

5.1.2 Modo de escribir un valor en el estado de aplicacin con bloqueo

Varios subprocesos pueden tener acceso, simultneamente, a las
variables de estado de aplicacin. Para establecer los valores es
necesario bloquearlas para que slo pueda escribir en un subproceso.
Para establecer el valor de la variable de aplicacin, llame al mtodo
Lock, y, a continuacin, llame al mtodo UnLock a fin de desbloquear
el estado de aplicacin y liberarlo para otras solicitudes de escritura.
En el ejemplo de cdigo siguiente, incremente la variable Count en
uno (1) y, a continuacin, desbloquee el estado de aplicacin.
[Link]()
Application("Count") = CInt(Application("Count")) + 1
[Link]()

5.2 MODO DE LEER VALORES EN UN ESTADO DE APLICACIN

El estado de aplicacin almacena los datos como tipos de datos Object. Por
consiguiente, debe convertirlos al tipo apropiado al recuperarlos.
5.2.1 Modo de leer un valor desde el estado de aplicacin
Determine si la variable de aplicacin existe y, a continuacin,
convirtala al tipo adecuado cuando tenga acceso a ella.
En el ejemplo de cdigo siguiente se recupera el valor AppTime de
estado de aplicacin y se convierte en una variable denominada
AppStartTime de tipo DateTime.
If (Not Application("AppTime") Is Nothing) Then
Dim AppTime As DateTime = CDate(Application("AppTime"))
End If

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

57

6. INFORMACIN SOBRE EL ALMACENAMIENTO EN CACH

Para ayudarle a aumentar el rendimiento de la aplicacin, [Link] proporciona
almacenamiento en cach mediante dos mecanismos bsicos: almacenamiento
en cach de aplicaciones y cach de los resultados de las pginas

6.1 CACH DE APLICACIONES

Permite almacenar en memoria datos arbitrarios mediante programacin
utilizando pares de clave y valor. Los datos de la cach de aplicaciones son
voltiles. La ventaja de utilizar la cach de aplicaciones es que [Link] se
encarga de administrarla y elimina los elementos cuando caducan o se
invalidan, o cuando hay poca memoria.

6.2 CACH DE RESULTADOS DE PGINAS

Almacena en memoria el contenido de una pgina [Link] procesada. Esto

permite a [Link] enviar una pgina de respuesta a un cliente sin volver a
recorrer el ciclo de vida de procesamiento de la pgina. El almacenamiento
en cach de los resultados de las pginas resulta especialmente til en
aquellas pginas que no cambian a menudo, pero cuya creacin requiere un
cantidad significativa de procesamiento.
El almacenamiento en cach de resultados de pginas proporciona dos
modelos de almacenamiento: almacenamiento en cach de pginas
completas y almacenamiento en cach de una parte de las pginas. El
almacenamiento en cach de pginas completas permite conservar el
contenido completo de la pgina en memoria y utilizarlo para satisfacer las
solicitudes de los clientes. El almacenamiento en cach de una parte de las
pginas permite almacenar en la cach ciertas partes de una pgina,
mientras otras se recuperan de forma dinmica.

6.1 MODO DE AGREGAR ELEMENTOS A CACHE

El objeto Cach tiene acceso a los elementos en la cach de la aplicacin.

Puede agregar un elemento a la cach de la aplicacin utilizando:
El mtodo Insert: agrega un elemento a la cach, si un elemento con el
mismo nombre se reemplaza el elemento de la cach.
El mtodo Add: maneja las mismas opciones que el mtodo Insert; sin
embargo, si ya existe un elemento con el mismo nombre en la cach, el
mtodo no reemplazar el elemento y no producir una excepcin.
6.1.1 Modo de agregar un elemento a la cach estableciendo
directamente el elemento a travs de la clave y valor
Cache("CacheItem1") = "Cached Item 1"
6.1.2 Modo de agregar elementos a la cach mediante el mtodo Insert
[Link]("CacheItem2", "Cached Item 2")

6.1.3 Modo de agregar un elemento a la cach especificando una

dependencia
El siguiente ejemplo de cdigo agrega un elemento denominado
CacheItem3 que es dependiente de otro elemento en la cach
denominado CacheItem2:
Dim dependencies As String() = {"CacheItem2"}
[Link]("CacheItem3", "Cached Item 3", _
New [Link](Nothing, dependencies))

CIBERTEC

CARRERAS PROFESIONALES

58

6.1.4 Modo de agregar un elemento a la cach con directivas de

caducidad
Llame al mtodo Insert pasndole una hora de caducidad absoluta o
un plazo de tiempo.
El ejemplo agrega un elemento a la cach con plazo de
caducidad de 10 minutos:
[Link]("CacheItem7", "Cached Item 7", Nothing, _
[Link], New TimeSpan(0, 10, 0))
6.1.5 Modo de agregar un elemento a la cach mediante el mtodo Add
Llame al mtodo Add, que devuelve un objeto que representa el
elemento.
El siguiente ejemplo agrega un elemento a la cach y establece
el valor de la variable para que sea el elemento que se agreg.
Dim CacheIt As String = CStr([Link]("Item9", "Item 9", _
Nothing, [Link], _
[Link], _
[Link], Nothing))

6.2 MODO DE RECUPERAR VALORES ALMACENADOS EN CACHE

Para recuperar los datos de la cach, especifique la clave con la que se
almacen el elemento en memoria cach.
6.2.1 Modo de obtener el valor de un elemento almacenado en cach
Compruebe si el elemento no es null, en el objeto Cache. Si existe,
asgnelo a su variable. De lo contrario, vuelva a crear el elemento,
agrguelo a la cach y, a continuacin, tenga acceso a l.
En el ejemplo, se muestra cmo recuperar el elemento
denominado CacheItem de la memoria cach. Si el elemento no
est en la cach, el cdigo agrega el elemento a la cach y, a
continuacin, asigna el elemento a cachedString.
Dim cachedString As String = CStr(Cache("CacheItem"))
If cachedString Is Nothing Then
cachedString = "Hello, World."
[Link]("CacheItem", cachedString)
End If

6.3 MODO DE ELIMINAR ELEMENTOS DE CACH EN [Link]

Los datos almacenados en la cach de [Link] son voltiles. Se pueden
eliminar automticamente de la cach por una de las razones siguientes:

La cach est llena.

El elemento ha caducado.

Un elemento depende de ciertos cambios.

El mtodo concreto utilizado para eliminar un elemento de la cach se
determina en el cdigo que se emplea para agregar el elemento a la cach.
6.3.1 Modo de eliminar un elemento de la cach de forma explcita
Llame al mtodo Remove y psele la clave del elemento a eliminar.
[Link]("MyData1")

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

59

7. DISEANDO UNA APLICACIN WEB [Link]

En este captulo vamos a crear, personalizar y administrar una aplicacin Web
[Link] (a veces denominada simplemente sitio Web). En estos temas, se ofrece
informacin relativa a la aplicacin o sitio en su totalidad: la estructura de archivos de
un sitio Web [Link], el ciclo de vida de una aplicacin, los mtodos para crear un
aspecto (temas) y un diseo (pginas principales) coherentes en todas las pginas del
sitio y cmo ampliar la aplicacin con mdulos personalizados.

7.1 PGINAS PRINCIPALES DE [Link]

Las pginas principales de [Link] permiten crear un diseo de pgina
que se puede utilizar en ciertas pginas o en todas (pginas de contenido) en
un sitio Web.
Una pgina principal es un archivo de [Link] con la extensin .master que
tiene un diseo predefinido que puede incluir texto esttico, elementos HTML
y controles de servidor. La pgina principal se identifica mediante una
directiva @Master especial que reemplaza la directiva @Page utilizada en las
pginas .aspx ordinarias. El aspecto de la directiva es el siguiente:
<%@ Master Language="VB" CodeFile="[Link]" Inherits="MPage" %>
Adems de la directiva @ Master, la pgina principal tambin incluye todos
los elementos HTML de nivel superior de una pgina, como html, head y
form. Por ejemplo, en una pgina principal podra utilizar una tabla HTML
para el diseo, un elemento img para el logotipo de la compaa, texto
esttico para el aviso de copyright y controles de servidor para crear la
exploracin estndar del sitio.
Adems del texto esttico y los controles que aparecern en todas las
pginas, la pgina principal tambin incluye controles ContenPlaceHolder.

7.2 CONTENT PAGES (PGINAS DE CONTENIDO)

Para definir el contenido de los controles PlaceHolder de la pgina principal,

cree pginas de contenido individuales, que son pginas [Link] que estn
enlazadas a una pgina principal concreta. El enlace se establece en la
directiva @ Page de la pgina de contenido al incluir un atributo
MasterPageFile que apunta a la pgina principal que se va a utilizar.
Por ejemplo, una pgina de contenido podra tener la siguiente directiva
@ Page, que la enlaza con la pgina [Link].
<%@Page Language="VB" MasterPageFile="~/[Link]" %>

En la pgina de contenido, cree el contenido agregando los controles

Content y asignndolos a los controles ContentPlaceHolder de la pgina
principal.

CIBERTEC

CARRERAS PROFESIONALES

60

7.3

MBITO DE LAS PGINAS PRINCIPALES

Puede adjuntar pginas de contenido a una pgina principal en tres niveles:

1. En el nivel de la pgina Puede utilizar una directiva de pgina en
cada pgina de contenido para enlazarla a una pgina principal, como
en el ejemplo de cdigo siguiente.
<%@ Page Language="VB" MasterPageFile="[Link]" %>
2.

En el nivel de la aplicacin Al establecer la configuracin del

elemento pages en el [Link], puede especificar que todas las
pginas de [Link] (archivos .aspx) de la aplicacin se enlacen
automticamente a una pgina principal. El elemento podra tener el
aspecto siguiente:
<pages masterPageFile="[Link]" />

3.

En el nivel de la carpeta Esta estrategia es igual que la estrategia de

definir enlaces en el nivel de la aplicacin, excepto en que la
configuracin se define en un archivo [Link] en una nica carpeta.

7.4 MODO DE CREAR UNA PGINA PRINCIPAL

La pgina principal es la plantilla que define la apariencia que tendrn las
pginas. A continuacin se crear primero una pgina principal.
7.4.1 Modo de aadir una pgina principal al Web Site
1. En el Explorador de soluciones, haga clic con el botn secundario
del mouse en el sitio Web y, a continuacin, seleccione Agregar
nuevo Item.
2. En Plantillas, haga clic en Pgina principal.
3. En el cuadro Nombre, escriba Master1.
4. En la lista Lenguaje, haga clic en el lenguaje de programacin con
el que prefiera trabajar y, a continuacin, haga clic en Agregar.
7.4.2 Edicin de la pgina principal
La pgina principal define la apariencia de las pginas del sitio. Puede
contener cualquier combinacin de texto esttico y controles. Una
pgina principal tambin contiene uno o ms marcadores de posicin de
contenido los cuales indican dnde aparecer el contenido. Cuando
edita una pgina principal, el diseador le ayuda de las siguientes
maneras:
Como valor predeterminado, la pgina principal contiene un nico
control ContentPlaceHolder. Se pueden agregar tantos
ContentPlaceHolder adicionales como sean necesarios.
En la vista de cdigo fuente, el editor comprueba el marcado de la
pgina para asegurarse de que no agrega elementos o atributos que
no sean vlidos en las pginas principales. Por ejemplo, si agrega
un control Content a una pgina principal en la vista de cdigo
fuente, el editor marca el control porque los controles Content no
estn permitidos en las pginas principales.
Cuando edita una pgina principal en el diseador, el men Sitio
Web y el men del botn secundario contienen el comando Agregar
pgina de contenido, el cual crea una pgina nueva que ya est
vinculada con la pgina principal actual.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

61

7.5 PGINAS PRINCIPALES ANIDADAS

Las pginas principales anidadas permiten crear pginas principales divididas

en componentes. Por ejemplo, un sitio de gran volumen podra contener una
pgina principal general en la que se define la apariencia del sitio. Otros
colaboradores del contenido del sitio pueden definir sus propias pginas
principales secundarias que harn referencia a la pgina principal del sitio y
que, a su vez, definirn la apariencia del contenido de ese colaborador.

Una pgina principal secundaria tiene la extensin de nombre de archivo

.master, como cualquier pgina principal. La pgina principal secundaria,
normalmente, contiene controles de contenido que estn asignados a los
marcadores de posicin de contenido de la pgina principal primaria. En este
sentido, la pgina principal secundaria est diseada como cualquier pgina
de contenido.
Este es el archivo principal primario:
<% @ Master Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"[Link]
<html >
<body>
<form id="Form1" runat="server">
<div> <h1>Parent Master</h1> <p>
<font color="red">This is parent master content.</font> </P>
<asp:ContentPlaceHolder ID="MainContent" runat="server" /> </div>
</form> </body> </html>

Este es el archivo principal secundario:

<%@ Master Language="VB" master="[Link]"%>
<asp:Content id="Content1" ContentPlaceholderID="MainContent" runat="server">
<asp:panel runat="server" id="panelMain" backcolor="lightyellow">
<h2>Child master</h2>
<asp:panel runat="server" id="panel1" backcolor="lightblue">
<p>This is childmaster content.</p>
<asp:ContentPlaceHolder ID="Content1" runat="server" />
</asp:panel>
<asp:panel runat="server" id="panel2" backcolor="pink">
<p>This is childmaster content.</p>
<asp:ContentPlaceHolder ID="Content2" runat="server" />
</asp:panel>
</asp:panel>
</asp:Content>

Este es un archivo secundario que hace referencia a la pgina principal

secundaria:
<%@ Page Language="VB" master="[Link]"%>
<asp:Content id="Content1" ContentPlaceholderID="Content1" runat="server">
<asp:Label runat="server" id="Label1" text="Child label1" font-bold="true" /> <br>
</asp:Content>
<asp:Content id="Content2" ContentPlaceholderID="Content2" runat=server>
<asp:Label runat="server" id="Label2" text="Child label2" font-bold=true/>
</asp:Content>

CIBERTEC

CARRERAS PROFESIONALES

62

8. MANEJO DE TEMAS Y MSCARAS EN [Link]

Los temas de [Link] son una coleccin de propiedades que definen el aspecto
de las pginas y los controles de un sitio Web. Un tema puede contener archivos
de mscara, que definen los valores de las propiedades de los controles de
servidor Web de [Link]; tambin pueden contener archivos de hojas de estilos
en cascada (archivos .css) y grficos. Si se aplica un tema, se puede dar a todas
las pginas del sitio Web un aspecto coherente.

8.1 MODO DE APLICAR TEMAS EN [Link]

Puede aplicar los temas a una pgina, un sitio Web o globalmente. Al
establecer un tema en el nivel del sito Web los estilos y mscaras se aplican a
todas las pginas y controles del sitio, a no ser que reemplace un tema para
una pgina individual. Al establecer un tema en el nivel de la pgina, los
estilos y mscaras se aplican a esa pgina y a todos sus controles.
8.1.1

Aplicar un tema a un sitio web

En el archivo [Link] de la aplicacin, establezca el elemento
<pages> en el nombre del tema, ya sea ste global o de pgina, como
se muestra en el siguiente ejemplo:
<configuration>
<[Link]>
<pages theme="ThemeName" />
</[Link]>
</configuration>

Para establecer un tema como tema de la hoja de estilos de forma que

se subordine a la configuracin local del control, establezca en su lugar
el atributo styleSheetTheme:
<configuration>
<[Link]>
<pages styleSheetTheme="Themename" />
</[Link]>
</configuration>

8.1.2

Aplicar un tema a una pgina individual

Establezca el atributo Theme o StyleSheetTheme de la directiva
@ Page en el nombre del tema que se va a utilizar, como se muestra en
el siguiente ejemplo:
<%@ Page Theme="ThemeName" %>
<%@ Page StyleSheetTheme="ThemeName" %>

8.2 MODO DE APLICAR MSCARAS A LOS CONTROLES

Las mscaras definidas en el tema se aplicarn en todas las instancias de

controles de la aplicacin o en las pginas a las que se aplique el tema. En
algunos casos, es posible que desee aplicar un conjunto concreto de
propiedades a un control individual. Puede hacerse creando una mscara con
nombre (entrada en un archivo .skin que tiene establecida la propiedad

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

63

SkinID) y aplicndola a continuacin mediante el identificador a controles

individuales.
8.2.1 Aplicar una mscara con nombre a un control
Establezca la propiedad SkinID del control, como se muestra en el
ejemplo siguiente:
<asp:Calendar runat="server" ID="DatePicker"
SkinID="SmallCalendar" />

8.3 MODO DE APLICA TEMAS MEDIANTE PROGRAMACIN

Aparte de especificar las preferencias de mscaras y temas en las

declaraciones de pgina y los archivos de configuracin, puede aplicar temas
mediante programacin. Puede establecer mediante programacin temas de
pginas y temas de hojas de estilos; sin embargo, el procedimiento para
aplicar cada tipo de tema es diferente.

8.3.1

Aplicar un tema mediante programacin

En el ejemplo siguiente se muestra cmo establecer el tema de una
pgina basndose condicionalmente en un valor pasado en la cadena
de consulta.
Protected Sub Page_PreInit(ByVal sender As Object, _
ByVal e As [Link]) _
Handles [Link]
Select Case [Link]("theme")
Case "Blue"
[Link] = "BlueTheme"
Case "Theme2"
[Link] = "PinkTheme"
End Select
End Sub

8.3.2

Aplicar mscaras de control mediante programacin

En el ejemplo de cdigo siguiente se muestra cmo se establece la
propiedad SkinID de un control Calendar. En el ejemplo se supone que
ya se ha establecido el tema de la pgina.
Sub Page_PreInit(ByVal sender As Object, _
ByVal e As [Link]) _
Handles [Link]
[Link] = "CustomSkin"
End Sub

8.4 CREACIN DE TEMAS GLOBALES

Un tema global se aplica a todos los sitios Web de un servidor. La ubicacin

en la que se crea una carpeta para los temas globales depende de si se
ejecuta el sitio Web con Servicios de Internet Information Server (IIS) o si se
prueba con el servidor de desarrollo de [Link].
8.4.1 Modo de crear un tema global
1. Cree una carpeta Themes con la ruta de acceso siguiente.
%windows%\[Link]\Framework\version\[Link]\T
hemes

CIBERTEC

CARRERAS PROFESIONALES

64

2.
3.
4.
5.

Cree una subcarpeta de la carpeta Themes para que contenga los

archivos de temas globales.
Agregue archivos a la carpeta para incorporar las mscaras de
controles, hojas de estilos e imgenes que compondrn el tema
global.
Si el sitio Web es un sitio Web de sistema de archivos que est
probando con el servidor de desarrollo de [Link], el tema est
listo para realizar las pruebas.
Si est probando el sitio Web utilizando un sitio Web local de IIS,
abra una ventana de comandos y ejecute aspnet_regiis -c para
instalar el tema en el servidor donde e ejecuta IIS.
Si est probando el tema en un sitio Web remoto o en un sitio Web
de FTP, debe crear manualmente una carpeta de temas en la
siguiente ruta de acceso.
IISRootWeb\aspnet_client\system_web\version\Themes

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

65

LABORATORIO 3.1
DISEO DE UN SITIO WEB

En este laboratorio, se crear Sitio Web utilizando un Master Page. El master Page
deber visualizar un banner de imgenes, el logo de la institucin, el usuario y la
institucin a la que pertenece.
1. Ingrese a Visual Studio 2008
2. Seleccione Files
New
Web Site; asigne el nombre de WebSite3
3. Agregue al Web Site un nuevo elemento; seleccione en Plantillas el tem
Master Page.
4. Asigne el Nombre: [Link].
5. Active la casilla de verificacin, Colocar codigo en un archivo independiente

Seleccione la
plantilla
Master Page

Nombre al
Master Page

6. Con el Master Page agregado, establezca al color de fondo (BgColor) del

documento un color distintivo: Seleccione DOCUMENT de la ventana de
propiedades y seleccione un color a la propiedad BgColor.
Pagina de
Contenido del
Master Page

Propiedad
BgColor de
DOCUMENT

CIBERTEC

CARRERAS PROFESIONALES

66

7. En el men TABLA, seleccione la opcin INSERTAR

TABLA.
8. En la ventana insertar tabla defina el tamao de la tabla:
5 filas y 1 columna, tal como se muestra en la figura y, a
continuacin, haga clic en Aceptar.

Seleccione 5 filas

Seleccione 1
columna

9. Agregue los siguientes controles a las celdas de la tabla de la pgina principal:

control Image, AdRotator y Label.
Para configurar el control AdRotator, agregue un archivo XML llamado
[Link]; agregue las etiquetas para configurar el banner. Luego en la
propiedad AdvertisimentFile del control AdRotator asociarlo con el archivo
XML.
Arrastre el ContentPlaceHolder al centro de la tabla, tal como se muestra en
la figura.
En la cabecera agregue un
control Image y un control
AdRotator

Arrastre el
ContentPlaceHolder al
centro de la tabla
En el pie agregue un label:
Copyright 2009 Cibertec

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

67

10. Para establecer mscara a los labels, vamos a definir un Skin llamado
[Link]
Dentro de la carpeta
App_Themes agregue el
tema Labels; a partir de
all agregue la mscara

Agregue una mscara

cuyo nombre es
[Link]

11. Defina las mscaras para los labels dentro del archivo SkinLabel

12. Para activar las mscaras, en la etiqueta <page>

del archivo [Link] agregue el atributo theme:

<pages theme="Labels">
13. Para establecer las mscaras a cada label, asinarle
en la propiedad SkinID de la ventana de
propiedades.
14. Agregue un Web Form al proyecto llamado [Link]; en la casilla de
verificacin Seleccionar Pgina Principal y, a continuacin, haga clic en
Agregar. Aparece el cuadro de dilogo Seleccionar Master Page. Haga clic
en [Link] y en Aceptar.

Habilite la opcin
Seleccionar la pgina
principal al Web Form

CIBERTEC

CARRERAS PROFESIONALES

68

Seleccione la pgina
principal que se asocia al
Web Form [Link],
luego presione el botn
Aceptar

15. En la pgina [Link] personalizar el Content para agregar controles;

habilte la opcin Crear contenido personalizado desde la lista de tareas del
Content, tal como se muestra.

Desde la lista de tareas

del Content, habilite la
opcin Crear contenido
personalizado

16. Agregue los controles Label e Image dentro del Content1, tal como se muestra
en la figura.

Agregue dentro de
Content1 los
controles Label e
Image

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

69

17. En la ventana Explorador de Soluciones, seleccione la pgina Default como

pgina de inicio, presione la combinacin de teclas CTRL + F5 para ejecutar
la aplicacin.

LABORATORIO 3.2
IMPLEMENTACIN DE ESTILO A LOS CONTROLES EN
TIEMPO DE EJECUCION

En este laboratorio, implemente una pgina Web que calcule los Honorarios
Profesionales donde, si el monto de la remuneracin a pagar es mayor a 1500, se
le aplicar un descuento del 10% de su remuneracin sino su descuento ser cero.
Implemente estilos para visualizar los resultados de los controles.
1. En el WebSite3 agregue un Web Form llamado [Link].
2. Disee la pgina Web tal como se muestra

TextBox, ID: txtempleado

TextBox, ID: txtbasico
TextBox, ID: txtbonif
TextBox, ID: txtneto

TextBox, ID: txtremun

TextBox, ID: txtdescuento

CIBERTEC

CARRERAS PROFESIONALES

70

3. Defina las funciones de estilo para los controles de tipo Label y Button y la
funcin Resultados.

4. Programe el evento Load que inicialice la definicin de los controles Label y

Button a travs de la propiedad ApplyStyle. En el evento Click del control
BtnCalcular, calcula la remuneracin, el descuento y neto; adems, asigne el
estilo a los controles txtdescuento y txtneto a travs de la funcin Resultados.

5. Seleccione la pgina como pgina de inicio y presione la combinacin de teclas

CTRL + F5.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

71

LABORATORIO 3.3
MANEJO DE UN ESTADO DE VISTA

En este laboratorio, se implementar una pgina en la cual los alumnos pueden

visualizar el plan curricular del ciclo que ha seleccionado en una lista.
1. En el WebSite3, agregue nuevo Elemento.
2. Agregue un Web form llamado pageCurricula.
3. Disee el Web Form agregado, tal como se muestre en la figura.

Control ListBox
permite mostrar
los ciclos
acadmicos.

Control GridView
visualiza la
currcula por ciclo
seleccionado.

4. Cifre los estados de vista, asigne al atributo ViewStateEncriptionMode el valor

de Always.

Defina el atributo
ViewStateEncryptionMode
y asigne el valor de Always

5. Inicie la codificacin en la vista,

defina dentro de la etiqueta body
la
etiqueta
<script
runat=server>.

El atributo <script runat=server>,

indica que se ejecutara los
procesos en el lado del servidor

CIBERTEC

CARRERAS PROFESIONALES

72

6. Defina dos funciones: la funcin TablaCiclos que define los campos del plan
curricular por ciclo y la funcin Ciclos, que almacena los ciclos de estudios de
la carrera.

Funcin Ciclos
define los ciclos
acadmicos de la
carrera.

Funcin
TablaCiclos
define las
columnas del plan
curricular.

7. Defina las funciones

para
cada
ciclo
acadmico, donde se
registrar, en cada
ciclo, los cursos, el
nmero de crditos
por curso y el prerequisito, tal como se
muestra.

Defina una
funcin de tipo
DataTable para
cada ciclo.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

73

8. En el evento Init,
registre a cada estado
de vista una funcin
que representa el ciclo.
9. En el evento Load
asigne a la propiedad
DataSource
del
ListBox1 el estado de
vista ciclos.
10. Defina el controlador de evento Selecciona que permite evaluar el texto
seleccionado del control ListBox1. Segn el texto seleccionado (ciclo),
visualizamos el plan curricular del ciclo, tal como se muestra.

LABORATORIO 3.4
MANEJO DE COOKIES

En este laboratorio, implemente una pgina Web form que permita registrar los
datos personales de un usuario: nombre, email y confirmar su email.
Si est correcto su ingreso, visualizaremos en otra pgina los datos ingresados.
1. Agregue un Web form llamado pageIngreso
2. Agregue los controles de servidor y controles de validacin tal como se
muestra en la figura

RequiredFieldValidator que
valida al control txtusuario

Control CompareValidator,
que se compara con el
control txtemail

RequiredFieldValidator que
valida al control txtemail

CIBERTEC

CARRERAS PROFESIONALES

74

3. A continuacin, procedemos a codificar el botn Aceptar

Defina el cookie
datos, agregue
dos valores:
nombre, email

4. Disea el Web Form [Link] y agregamos sus controles

Control txtusuario
Control txtemail

5. Para visualizar los datos de la pgina anterior, codifiquemos en el evento

Page_Load de la pgina.
Pregunto si existe el
cookie datos
Declaro al cookie
cookiedatos y le asigno
al cookie datos

Mostrar los valores del

cookie en los TextBox

Expirar el cookie

6. En el Explorador de Soluciones, seleccione la pgina pageIngreso como

pgina de inicio, presione la combinacin de teclas CTRL + F5 para ejecutar.

LABORATORIO 3.5
MANEJO DE UN ESTADO DE APLICACIN

En este laboratorio, se implementa una pgina que imprima el total de visitas y la

cantidad de usuarios activos en el sitio Web.
1. En el WebSite3 agregue un Web form llamado pageVisitas.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

75

2. Disee el Web Form agregado, tal como se muestre en la figura.

Control label, ID lblvisitas

Control label, ID lblusuarios

3. Para trabajar con estado

de aplicacin, agregue al
WebSite3 el elemento
Clase
de
aplicacin
global cuyo nombre es
[Link], tal como se
muestra en la figura.

4. Para registrar las visitas y los usuarios activos, definimos dos objetos
application: visitas y usuarios, en el evento Application_Start
Cuando se inicie la aplicacin, los objetos visitas y usuarios, incrementarn su
valor. Cuando cerramos la aplicacin, descontamos en 1 el valor del objeto
usuario en el evento Application_End

Evento donde se
incrementa
usuarios y visitas
al iniciar

Evento donde
disminuye
usuarios al
terminar

CIBERTEC

CARRERAS PROFESIONALES

76

5. Programe el evento Page_Load de la pgina para visualizar la cantidad de

visitas y los usuarios activos en los controles: lblusuarios y lblvistitas.

6. Seleccione la pgina pageVisitas como pgina de inicio, presione la

combinacin de teclas CTRL + F5 para ejecutar.

LABORATORIO 3.6
MANEJO DE UN ESTADO DE SESIN

En este laboratorio, implemente una pgina la cual ingresar los datos del
solicitante y de los cursos que desea tener informacin en el departamento de
tecnologa de Cibertec DAT. Los datos del solicitante y los cursos seleccionados
se visualizarn en otra pgina.
1. En el WebSite3, agregue un Web Form llamado PageInformacion.
2. Disee el Web Form agregado, tal como se muestre en la figura.
Control textbox, ID:
txtnombre
Control textbox, ID:
txtapellido
Control textbox, ID:
txtmail

Control
CheckBoxList1,
agregue sus tems
en la ventana de
propiedades: Items

3. En el archivo [Link], definimos el estado de sesin para los objetos

nombre, apellido y mail; para el caso de los cursos, defina un objeto DataTable

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

77

y agregue las columnas; a continuacin defina un estado de sesin llamado

tabla para el DataTable definido.

Defina los estados

de Session en el
evento
Session_Start
para cada objeto.

Al terminar la
sesin en el
evento
Session_End,
libere la sesin
actual: ejecute el
mtodo Abandon.

4. En el Web Form PageInformacion, registre los datos del solicitante y

seleccione los cursos en la lista. El botn Resumen permite almacenar los
datos ingresados en los estados de sesin.
Asigne
a
cada
estado de sesin un
valor.

Defina un objeto de tipo

DataTable al cual se le
asignar el estado de
sesin
tabla
convertida
a
DataTable, donde este
objeto almacenar los
cursos seleccionados.

5. Agregue y disee el
Web
Form
PageResumen tal
como se muestra.

CIBERTEC

CARRERAS PROFESIONALES

78

6. Para mostrar los datos, almacenados en los estados de sesin, en los

controles web de la form PageResumen, codifique las operaciones en el
evento Page_Load

7. En el Explorador de Soluciones, seleccione la pgina PageInformacion como

pgina de inicio, presione la combinacin de teclas CTRL + F5 para ejecutar.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

79

Autoevaluacin
1. Defina cada una de las opciones para administrar el estado en el cliente
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------2. Defina cada una de las opciones para administrar el estado en el servidor
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------3. Qu es una cookie y cul es su limitacin?
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------4. Cmo escribir una cookie? Se puede definir una cookie con varios valores?
Explique.
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------5. Qu es un estado de sesin y cuales son sus eventos?
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------6. Qu es un estado de aplicacin y cmo se declara un estado de aplicacin?
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------7. Qu es un Master Page y cmo funciona?
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------8. Qu es una pgina de contenido, cual es la sintaxis al aadir una pgina de
contenido al Master Page?
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------9. Cul es el comportamiento de un Master Page en tiempo de ejecucin?
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------10. Cmo configurar una pgina de contenido en un Master Page?
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

CIBERTEC

CARRERAS PROFESIONALES

80

Para recordar
 El estado de vista es el mtodo que utiliza el marco de trabajo de la pgina
[Link] para conservar los valores de pgina y control entre acciones de ida
y vuelta. La propiedad ViewState es un diccionario que contiene pares
clave/valor con los datos del estado de vista.
 El estado de sesin de [Link] permite almacenar y recuperar los valores de
un usuario cuando el usuario explora diferentes pginas [Link] que
conforman una aplicacin Web. El estado de sesin de [Link] identifica las
solicitudes recibidas desde el mismo explorador durante un perodo limitado de
tiempo como una sesin y conserva los valores de las variables durante la
duracin de esa sesin. [Link] proporciona dos eventos que ayudan a
administrar las sesiones de usuario: Session_OnStart se desencadena
cuando comienza una nueva sesin, y Session_OnEnd se desencadena
cuando se abandona o caduca una sesin.
 El estado de aplicacin es un repositorio de datos disponible para todas las
clases de una aplicacin [Link]. El estado de aplicacin se almacena en la
memoria del servidor y ofrece ms rapidez que el almacenamiento y la
recuperacin de informacin de una base de datos.
 La cach de aplicaciones permite almacenar, en memoria, datos arbitrarios
mediante programacin utilizando pares de clave y valor. La cach de
aplicaciones son voltiles, lo que significa que no se almacenan en memoria
durante toda la duracin de la aplicacin.
 Un Master Page es un archivo de [Link] con la extensin .master que tiene
un diseo predefinido que puede incluir texto esttico, elementos HTML y
controles de servidor. El Master Page se identifica mediante una directiva
@Master que reemplaza la directiva @Page utilizadas en las paginas aspx.
 Para definir el contenido de los controles de la pgina principal, cree pginas
de contenido individuales, que son pginas [Link] (archivos .aspx y,
opcionalmente, archivos de cdigo subyacente) que estn enlazadas a una
pgina principal concreta. El enlace se establece en la directiva @ Page de la
pgina de contenido al incluir un atributo MasterPageFile que apunta a la
pgina principal que se va a utilizar.
 Puede adjuntar pginas de contenido a un Master Page en tres niveles:
En el nivel de la pgina, puede utilizar una directiva de pgina en cada
pgina de contenido para enlazarla a una pgina principal.
En el nivel de la aplicacin, en el [Link], puede especificar todas las
pginas de [Link] (archivos .aspx) de la aplicacin que se van a enlazar.
En el nivel de la carpeta, la configuracin se define en un archivo [Link]
en una nica carpeta.
 Si desea hacer consultas:

[Link]
Pgina referente al Master Page
[Link]

Pgina referente al manejo de temas y mscaras

[Link]
Pgina referente al manejo de estados

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

81

UNIDAD DE
APRENDIZAJE

2
SEMANA

4
ACCESO A DATOS
LOGRO DE LA UNIDAD DE APRENDIZAJE
Al trmino de la unidad, los alumnos elaboran aplicaciones Web que acceden a un
origen de datos y construyen reportes, listados y grficos en Crystal Report usando el
modelo de objetos [Link].

TEMARIO








El modelo de objetos [Link]

Manejo de datos utilizando DataSet y DataReader
Manejo de controles de datos: GridView, DataList, DropDownList.
Manejo de controles DataSource: SqlDataSource, ObjectDataSource y
XmlDataSource, LinqDataSource.
Manejo de reportes con Crystal Report
Uso de reportes grficos
Llamar a un servicio Windows Communication Foundation (WCF) o a un
servicio Web desde una pgina Web [Link].

ACTIVIDADES PROPUESTAS

Los alumnos manejan la conexin a la base de datos de un origen de datos.

Los alumnos consultan y actualizan los datos desde un origen de datos
Los alumnos configurar los controles enlazados a los datos para realizar
operaciones de consultas y actualizacin.

CIBERTEC

CARRERAS PROFESIONALES

82

1. INTRODUCCIN AL ACCESO A DATOS

La mayora de las aplicaciones se escriben para que procesen informacin que
est almacenada o lo estar en un soporte concreto: una base de datos o un
RDBMS. Es fundamental contar con servicios que hagan posible conectar con
esos recursos y transferir la informacin desde y hacia la aplicacin.
Estos servicios reciben la denominacin genrica de [Link]. Esta nueva
iteracin aporta una serie de interfaces y objetos, as como nuevos controles y
mejoras en las clases ya existentes y, tambin, en el propio motor que se encarga
de la manipulacin de los datos en el cliente.
[Link] incorpora varios proveedores de datos, entre ellos dos que permiten
conectar con SQL Server y Oracle, as como otros que facilitan el uso de
controladores ODBC y OLE DB para acceder a aquellos provenientes de Excel,
Access, MySQL, etc.

2. ARQUITECTURA DE ADO .NET

Tradicionalmente, el procesamiento de datos ha dependido principalmente de un
modelo de dos niveles basado en una conexin. A medida que el procesamiento
de datos utiliza
cada vez ms
arquitecturas de
varios niveles, los
programadores
estn pasando a
un enfoque sin
conexin con el
fin
de
proporcionar una
escalabilidad
mejor para sus
aplicaciones.
2.1 COMPONENTES DE [Link]
Existen dos componentes de ADO .NET que se pueden utilizar para obtener
acceso a datos y manipularlos:
El DataSet
Proveedores de datos de .NET FrameWork
2.1.1 El DataSet
Est diseado para el acceso a datos independientemente del origen de
datos. Como resultado, se puede utilizar con mltiples y distintos orgenes
de datos, con datos XML o para administrar datos locales de la aplicacin. El
DataSet contiene una coleccin de uno o ms objetos DataTable formados
por filas y columnas de datos, as como informacin sobre claves
principales, claves externas, restricciones y relaciones relativas a los datos
incluidos en los objetos DataTable
2.1.2 Proveedores de datos de .NET Framework
Un proveedor de datos de .NET Framework sirve para conectarse a una
base de datos, ejecutar comandos y recuperar resultados. Los proveedores
de datos de .NET Framework crean un nivel mnimo entre el origen de
datos y su cdigo, con lo que aumenta el rendimiento sin sacrificar su
funcionalidad.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

83

Proveedor de Datos
[Link]: Acceso a datos para SQL Server 7.0 o posterior
[Link]: Origen de datos que se exponen mediante OLE DB
[Link]: Origen de datos que se exponen mediante ODBC
[Link]: Acceso a datos de Oracle 8.1.7 o posterior

2.1.3 Objetos principales de los proveedores de datos de .NET Framework

En la tabla siguiente se describen los cuatro objetos centrales que
constituyen un proveedor de datos de .NET Framework.
Objeto

Descripcin

Connection

Establece una
determinado.

Command

Ejecuta una sentencia o procedure. Expone Parameters

y puede ejecutarse en el mbito de un objeto
Transaction.

DataReader

Lee una secuencia de datos de slo avance y slo

lectura desde un origen de datos.

DataAdapter

Llena un DataSet y realiza

necesarias en el origen de datos.

conexin

un

origen

las

de

datos

actualizaciones

Los proveedores de datos de .NET Framework tambin incluyen las que se

enumeran en la tabla siguiente:

CIBERTEC

Objeto

Descripcin

Transaction

Permite incluir comandos en las transacciones que

se realizan en el origen de datos.

CommandBuilder

Objeto que genera las propiedades de comando de

un DataAdapter o que obtiene, de un
procedimiento almacenado, informacin acerca de
parmetros con las que puede rellenar la coleccin
Parameters de un objeto Command.

Parameter

Define los parmetros de entrada, salida para los

comandos y procedimientos almacenados.

Error

Expone la informacin relacionada con una

advertencia o error devueltos por un origen de
datos.

ClientPermission

Se proporciona para los atributos de seguridad de

acceso a cdigo de los proveedores de datos de
.NET Framework.

CARRERAS PROFESIONALES

84

3. CONEXIN A UNA BASE DE DATOS EN [Link]

3.1 CADENAS DE CONEXION

Proporciona la informacin que un proveedor necesita para comunicarse con

una base de datos determinada. Puede almacenarse en el archivo
[Link] y hacer referencia en un control de origen de datos.
Una cadena de conexin generalmente proporciona el origen de datos, la
base de datos que se debe utilizar y la informacin de autenticacin.

3.2 MODO DE ALMACENAR UNA CADENA DE CONEXIN EN EL

ARCHIVO [Link]

Incluir las cadenas de conexin en el archivo [Link]. En el elemento

<configuration>, se puede crear un elemento secundario denominado
<connectionStrings> e incluir all las cadenas de conexin:
<connectionStrings>
<add name="Cn" connectionString="Data Source=localhost; Initial Catalog
=Northwind; uid=sql; pwd=sql" providerName="[Link]" />
</connectionStrings>

Una ventaja del almacenamiento de la cadena de conexin en el [Link]

es que permite cambiar el nombre del servidor, la base de datos o la
informacin de autenticacin. Adems, puede proteger la cadena de conexin
mediante cifrado.

3.3 MODO DE RECUPERACIN DE UNA CADENA DE CONEXIN

PROGRAMTICAMENTE

Podemos recuperar cadenas de conexin programticamente desde el

[Link] en tiempo de ejecucin. En el siguiente ejemplo, se muestra
cmo recuperar una cadena de conexin y utilizarlo para abrir una conexin.
Dim strcon as String = _
[Link](Cn).ConnectionString
Dim cn as new [Link](strcon)

3.4 MODO DE PROTEGER CADENAS DE CONEXIN

El comando Aspnet_regiis.exe permite para cifrar la cadena de conexin;
este comando se ejecuta en la lnea de comandos de Windows con las
opciones siguientes:
La opcin -pe, pasndole la cadena "connectionStrings" para cifrar el
elemento connectionStrings.
La opcin -app, pasndole el nombre de su aplicacin.
En el ejemplo se muestra cmo se cifra la seccin connectionStrings del
archivo [Link] de una aplicacin denominada AplicacionWeb.
aspnet_regiis -pe "connectionStrings" -app "/AplicacionWeb"
3.4.1 Para descifrar el contenido cifrado del archivo [Link]
Ejecute la herramienta aspnet_regiis.exe con la opcin -pd. La sintaxis
es igual para cifrar el contenido, excepto que no se especifica ningn
proveedor de configuracin protegido.
En el siguiente ejemplo de cdigo se muestra cmo descifrar el
elemento connectionStrings de la aplicacin [Link] AplicacionWeb.
aspnet_regiis -pd "connectionStrings" -app "/ AplicacionWeb "

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

85

4. ACCESO A DATOS UTILIZANDO CONTROLES ENLAZADOS

A DATOS [Link]

Los controles enlazados a datos se pueden enlazar a un control de origen de

datos y buscar datos automticamente en el momento apropiado del ciclo de vida
de la solicitud de pgina.
Los controles enlazados a datos pueden aprovechar las ventajas de las funciones
proporcionadas por un control de origen de datos entre las que se incluyen la
ordenacin, la paginacin, el almacenamiento en cach, el filtrado, la
actualizacin, la eliminacin y la insercin.
Un control enlazado a datos establece una conexin con un control de origen de
datos a travs de su propiedad DataSourceID. Los controles enlazados a datos
que se describen en la tabla siguiente:
Controles
enlazados a datos

Descripcin

Controles de
Lista

Representan los datos en una variedad de formato de

listas. Entre los controles de lista se incluyen los controles
BulletedList, CheckBoxList, DropDownList, ListBox y
RadioButtonList.

DataList

Muestra un registro cada vez en disposicin de tabla y

permite editar, eliminar e insertar registros. Tambin se
puede realizar la paginacin a travs de varios registros.

DetailsView

Permite trabajar con un archivo XML, que es

especialmente til para controles de servidor [Link]
jerrquicos tales como el control TreeView o Menu.

FormView

Permite definir una disposicin de formato libre para cada

registro. El control FormView es como un control
DataList para un registro nico.

GridView

Muestra los datos en una tabla e incluye compatibilidad

para editar, actualizar, ordenar y paginar datos sin
necesidad de cdigo.

TreeView

Representa los datos en un rbol jerrquico de nodos que

se pueden expandir.

5. ARQUITECTURA DE DATOS EN [Link]

Se ha convertido en un principio ampliamente
aceptado en el diseo de aplicaciones
distribuidas la divisin de la aplicacin en
componentes que ofrezcan servicios de
presentacin, empresariales y de datos.
Los componentes que realizan tipos de
funciones similares se pueden agrupar en
capas, que en muchos casos estn
organizados en forma de apilamiento para que

CIBERTEC

CARRERAS PROFESIONALES

86

los componentes que se encuentran por "encima" de una capa determinada

utilicen los servicios proporcionados por sta, y un componente especifico utilizar
la funcionalidad proporcionada por otros componentes de su propia capa, y otras
capas "inferiores", para realizar su trabajo.
Desde un punto de vista de alto nivel, se puede considerar que la solucin basada
en servicios est formada por varios servicios, los cuales se comunican entre s
pasando mensajes. Desde el punto de vista conceptual, los servicios se pueden
considerar como componentes de la solucin global. Sin embargo, internamente el
servicio est formado por componentes de software, al igual que cualquier otra
aplicacin, los cuales se pueden agrupar de forma lgica en servicios de
presentacin, empresariales y de datos.

5.1 TIPOS DE COMPONENTES DE LA ARQUITECTURA

5.1.1 Componentes de interfaz de usuario (IU).
La mayor parte de las soluciones necesitan ofrecer al usuario un modo
de interactuar con la aplicacin. Las interfaces de usuario se
implementan utilizando formularios de Windows Forms, pginas
Microsoft [Link], u otro tipo de tecnologa que permita procesar y
validar los datos.
5.1.2 Componentes empresariales (BL).
La aplicacin requiere del uso de componentes que implementen reglas
empresariales y realicen tareas empresariales. Por ejemplo, en la
aplicacin comercial, deber implementar una funcionalidad que calcule
el precio total del pedido y agregue el costo adicional correspondiente
por el envo del mismo. Los componentes empresariales implementan la
lgica empresarial de la aplicacin.
5.1.3 Componentes lgicos de acceso a datos (DAL).
La mayora de las aplicaciones y servicios necesitan obtener acceso a
un almacn de datos en un momento determinado del proceso
empresarial. Por ejemplo, la aplicacin empresarial necesita recuperar
los datos de los productos para mostrar al usuario los detalles de los
mismos. Por tanto, es razonable abstraer la lgica necesaria para
obtener acceso a los datos en una capa independiente de componentes
lgicos de acceso a datos, ya que de este modo se centraliza la
funcionalidad de acceso a datos y se facilita la configuracin y el
mantenimiento de la misma.
5.14 Componentes de entidad empresarial (BE).
La mayora de las aplicaciones requieren el paso de datos entre distintos
componentes. Por ejemplo, en la aplicacin comercial es necesario
pasar una lista de productos de los componentes lgicos de acceso a
datos a los componentes de la interfaz de usuario para que ste pueda
visualizar dicha lista. Los datos se utilizan para representar entidades
empresariales del mundo real, como productos o pedidos. Las entidades
empresariales que se utilizan de forma interna en la aplicacin suelen ser
estructuras de datos, como conjuntos de datos, DataReader o
secuencias de lenguaje de marcado extensible (XML), aunque tambin
se pueden implementar utilizando clases orientadas a objetos
personalizados que representan entidades del mundo real necesarias
para la aplicacin, como productos o pedidos.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

87

LABORATORIO 4.1
DEFINICIN DE UN MASTER PAGE Y PUBLICACIN DE
UNA CONEXIN A UN ORIGEN DE DATOS

Implemente un portal para realizar consultas y actualizacin de datos. Disee un

MasterPage, agregue un control Men para listar las opciones de consultas;
publique la conexin a la base de datos llamada DBVentas, para que las
operaciones de consultas y/o actualizacin puedan acceder a esta base de datos.
1. Ingrese a Microsoft Visual Studio 2009
2. Agregue el proyecto de tipo Web Site y asigne el nombre de WebSite4.
3. Agregue la plantilla Master Page, asigne el nombre de [Link].
4. Disee los controles al Master Page tal como se muestra en la figura.

Control Image
Control Men:
Orientacin horizontal.
Agregue tems para las
opciones del control
Control
ContenPlaceHolder

5. Dentro del Master Page, dibuje un control Men. Agregue en la ventana del
editor tems y subitems donde a cada subitems se le ha asociado una pgina
Web form a travs de la propiedad NavigateUrl tal como se muestra

Propiedad que permite navegar

a una determinada pgina
Titulo del tem de men

6. Abra el archivo [Link] y en la etiqueta <connectionStrings>, aada una

conexin a la base de datos.

CIBERTEC

CARRERAS PROFESIONALES

88

LABORATORIO 4.2
DEFINICIN DE LA ARQUITECTURA DE DATOS:
CONSULTA DE DATOS EN UN CONTROL GRIDVIEW

En este laboratorio, implemente una arquitectura de datos para realizar las

operaciones de consulta y actualizacin de datos.
1. Defina las siguientes carpetas y clases dentro del App_Code

Carpeta para almacenar

las Entidad del Negocio
Carpeta para almacenar la
Capa lgica del Negocio

Carpeta para almacenar la

Capa de Acceso a Datos

2. Defina la cadena de conexin a la base de datos DBVentas en la clase

ConexionDAO
Funcin
GetCadenaConexion
que retorna la cadena
de conexin
publicada en el
[Link]

3. En la clase PedidosDAO, defina una funcin que retorne los pedidos

almacenados en la base de datos DBVentas

Instancia de la clase
ConexinDAO

Funcin Listado que

retorna los pedidos

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

89

4. En la clase PedidosBL defina la funcin que retorne los registros de la funcin

Listado de PedidosDAO

Funcin Listado de tipo

DataTable que retorne
los registros de pedidos
utilizando la funcin
listado de PedidosDAO

5. Agregue un Web form llamado pagePedidos, marque la opcin Select Master

Page y seleccione el Master Page [Link]. Dentro de Content1,
agregue los controles que se muestra en la figura

Control GridView,
para establecer
paginacin:
AllowPaging = true

6. Declare una funcin llamada pedidos de tipo DataTable que retorne los
registros de la tabla tb_pedidoscabe.
Instancia de PedidosBL

En el evento Load cargar el

GridView con el mtodo Listado
de la instancia de PedidosBL

CIBERTEC

CARRERAS PROFESIONALES

90

7. En el evento PageIndexChanging del control GridView1, permite visualizar los

registros al cambiar de pgina en el control.
Al realizar el cambio de pgina, volver a
asignar al origen de datos del GridView
los registros a travs del mtodo listado
de la instancia PedidosBL

8. En el Explorador de Soluciones, seleccione la pgina PagePedidos como

pgina de inicio, presione la combinacin de teclas CTRL + F5 para ejecutar.

LABORATORIO 4.3
CONSULTA DE DATOS UTILIZANDO COMANDOS
PARAMETRIZADOS

En este laboratorio, implemente una pgina donde listar todos los pedidos
almacenados en la base de datos DBVentas al seleccionar un cliente desde un
control DropdownList.
1. En la clase ClientesDAO defina una funcin que retorne los clientes.

Instancia de la clase
ConexinDAO

Funcin Listado
que retorna los
clientes

2. En la clase ClientesBL, defina la funcin que retorne los registros de la funcin

Listado de ClientesDAO

Funcin Listado de tipo

DataTable, retorna los
registros de clientes
desde el mtodo listado
de ClientesDAO

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

91

3. En la clase PedidosDAO, defina la funcin Listado_Cliente que retorne los

registros de pedidos por Cliente, valor de parmetro

Funcin Listado_Cliente
que retorna los pedidos
por cliente.

Programacin que
permite listar los pedidos
por cliente

4. En la clase PedidosBL, defina la funcin que retorne los registros de los

pedidos por cliente en PedidosDAO
Funcin Listado_Cliente que
retorna los registros de
pedidos por cliente desde el
mtodo listado_cliente de
PedidosDAO

5. Agregue un Web form llamado pagePedidosCliente, marque la opcin Select

Master Page y seleccione el Master Page [Link]. Dentro del
Content1, agregue los controles como se muestra en la figura.

Control DropDownList
lista los gneros
almacenadas,
AutoPostBack = true

CIBERTEC

CARRERAS PROFESIONALES

92

6. Defina las instancia de las entidades de negocio para pedidos y clientes

Definicin de las instancias de

negocios pedidos y clientes

7. Programe el evento Load de la pgina para configurar el control DropdownList

con la informacin de los clientes

Evento Load que configura el

dropdownlist con el mtodo
listado de clientes

8. Programe el evento SelectedIndexChanged del control DropDownList para

visualizar los pedidos del cliente seleccionado

Al seleccionar un cliente,
se ejecuta el mtodo
Listado_Cliente

9. Presione la combinacin de teclas CTRL + F5 para ejecutar y seleccione de la

opcin de men Consulta de Pedidos por Clientes.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

93

LABORATORIO 4.4
MANEJO DE PROCEDIMIENTOS ALMACENADOS

En este laboratorio, implemente una pgina donde liste los pedidos entre dos
fechas seleccionadas desde DBVentas. En este proceso se utilizar un
procedimiento almacenado llamado usp_pedidos_fechas.
1. Defina el procedimiento almacenado para realizar las consultas de pedidos
entre fechas.
CREATE PROCEDURE usp_pedidos_Fechas
@f1 datetime, @f2 datetime
As
Select * from tb_pedidoscabe
Where Fechapedido BETWEEN @f1 AND @f2

2. Defina el procedimiento almacenado para listar las fechas de la tabla pedidos.

CREATE PROCEDURE usp_Fechas
As
Select distinct FechaPedido from tb_pedidoscabe Order by 1

3. En la clase PedidosDAO, defina los mtodos Fechas () y Listado_Fechas ()

Mtodo fechas,
retorna las fechas de
los pedidos

Mtodo que lista los

pedidos entre dos
fechas, ejecuta un
procedure llamado
usp_pedidos_fechas

4. En la clase PedidosBL, defina los mtodos asociados a la clase PedidosDAO.

Funcin Fechas, retorna las
fechas de pedidos
Funcin Listado_Fechas, retorna los
pedidos entre dos fechas desde el
mtodo de PedidosDAO

CIBERTEC

CARRERAS PROFESIONALES

94

5. Agregue un Web form llamado pagePedidosFechas, seleccione el Master

Page [Link]. Agregue los controles como se muestra en la figura.

6. Defina la instancia de la capa de Negocios de pedidos

7. Programe el evento Load para cargar las fechas en los controles DropDownList

8. Programe el evento Click del control Button para ejecutar el mtodo

Listado_Fechas enviando como parmetros los valores seleccionados de los
controles DropDownList.
Mtodo que lista los pedidos entre
dos fechas, ejecuta un procedure
llamado usp_pedidos_fechas

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

95

LABORATORIO 4.5
CONSULTA DE DATOS UTILIZANDO CONTROLES DE
ORGENES DE DATOS Y MANEJO DE PROCEDIMIENTOS
ALMACENADOS EN [Link]

En este laboratorio, implemente una pgina donde liste los productos por
categora, seleccionados desde un control DropDownList, visualizando los
productos en un control DataList. En este proceso defina procedimientos
almacenados para la solucin del problema.
1. Defina el procedimiento almacenado para realizar las consultas de categoras.
CREATE PROCEDURE usp_categorias
AS
Select * from tb_categorias

2. Defina el procedimiento almacenado para listar las fechas de la tabla pedidos.

CREATE PROCEDURE usp_pedidos_categorias
@cat char(4)
AS
Select * from tb_productos
Where idcategoria=@cat

3. En la clase ProductosDAO, defina el mtodo categoras que retorne sus

registros

4. En la clase productosDAO, defina el mtodo pedidos por categora que retorne

los pedidos por categora

Mtodo que lista los productos por

una categora ejecutando el
procedure usp_pedidos_categoras

CIBERTEC

CARRERAS PROFESIONALES

96

5. Agregue un Web form llamado pageProductos, seleccione el Master Page

[Link]. Agregue los controles como se muestra en la figura

Control DataList que permite listar

los productos por columnas y filas

6. A continuacin, editamos el DataList para agregar controles en su plantilla:

seleccione desde la lista de Tareas la opcin Editar plantillas.

Seleccione la opcin Editar Plantilla

para agregar controles

7. En el ItemTemplate del control DataList, agregue los controles los cuales

permitirn visualizar los datos del producto. Al finalizar seleccionar la opcin
Terminar edicin de plantilla

Control Image de HTML

Controles Label

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

97

8. Enlace a cada Label, agregado al ItemTemplate, una columna de la tabla

tb_productos, tal como se muestra, presione el botn Aceptar

En la propiedad Text de cada Label,

asigne la expresin Eval(nombre campo)

9. Para determinar el nmero de columnas por fila, seleccione de Tareas del

DataList la opcin Generador de Propiedades

Asigne a la
propiedad Columns
el valor de 3,
donde, por cada
fila se visualiza
tres productos

10. Asignada la
propiedad, el
DataList
se
visualiza
tal
como
se
muestra en la
figura

CIBERTEC

CARRERAS PROFESIONALES

98

11. Como siguiente paso desarrollamos la parte de la programacin en el modelo

de la arquitectura n capas. En la clase clase ProductosBL referencie los
mtodos de la clase ProductosDAO:

Mtodo Categoras () que

referencia al mtodo de la
clase ProductoDAO

Mtodo Producto_Categoras ()
que referencia al mtodo de la
clase ProductoDAO

12. Para realizar el proceso de la consulta, en la pgina [Link],

instancie la clase ProductosBL en productos; en el evento Page_Load
configure el control DropDownList con los registros de Categoras.

Instancia de ProductosBL

Evento Load que configura el

dropdownlist con las categoras

13. Programe el evento SelectedIndexChanged del control DropDownList donde

liste los productos por categora.

Evento SelectedIndexChanged del

dropdownlist para listar los productos por
las categoras

13. Presione Ctrl + F5, al seleccionar una categora liste los productos.

CARRERAS PROFESIONALES

CIBERTEC

LENGUAJE DE PROGRAMACIN III

99

Autoevaluacin
1. Qu es [Link]?
2. Explique cada uno de los componentes que su utilizan en [Link]
3. Cules son los proveedores de base de datos ms utilizados en [Link]?
Explique cada uno de ellos.
4. Cules son los objetos principales de los proveedores de base de datos?
Explique cada uno de ellos.
5. Cmo se almacena una cadena de conexin en el [Link]?
6. Explique brevemente cada uno de los controles de orgenes de datos en
[Link]

Para recordar
 [Link] incorpora varios proveedores de datos, entre ellos dos que permiten
conectar con SQL Server y Oracle, as como otros que facilitan el uso de
controladores ODBC y OLE DB para acceder a aquellos provenientes de
Excel, Access, MySQL, etc.
 Existen dos componentes de ADO .NET que se pueden utilizar para obtener
acceso a datos y manipularlos: DataSet, Proveedores de datos de .NET
FrameWork
 El DataSet est diseado para el acceso a datos independientemente del
origen de datos. Contiene una coleccin de uno o ms objetos DataTable
formados por filas y columnas de datos, as como informacin sobre claves
principales, claves externas, restricciones y relaciones relativas a los datos
incluidos en los objetos DataTable
 Proveedores de datos sirve para conectarse a una base de datos, ejecutar
comandos y recuperar resultados. Los proveedores de datos de .NET
Framework crean un nivel mnimo entre el origen de datos y su cdigo, con lo
que aumenta el rendimiento sin sacrificar su funcionalidad.
 Una cadena de conexin proporciona la informacin que un proveedor
necesita para comunicarse con una base de datos determinada. Se puede
almacenar en el archivo [Link] y hacer referencia en un control de origen
de datos.
 Es recomendable incluir las cadenas de conexin en el archivo [Link]. En
el elemento <configuration>, se puede crear un elemento secundario
denominado <connectionStrings>
 Los controles enlazados a datos representan datos como marcados al
explorador que realiz la solicitud. Un control enlazado a datos se puede
enlazar a un control de origen de datos y buscar datos automticamente en el
momento apropiado del ciclo de vida de la solicitud de pgina.
 Consultar a las siguientes pginas:
 [Link]
ET_%20Dise%C3%B1o%20de%20Aplicaciones%20y%[Link]
Pgina referente a la arquitectura de servicios

CIBERTEC

CARRERAS PROFESIONALES

100

CARRERAS PROFESIONALES

CIBERTEC