Manual

de
Visual Studio 2010
Nombre:
Yomira Viviana Loor Nicola

Docente de la UTEQ:
Gleiston Cicern Guerrero
Ulloa

Materia:

Programacin Web

2015 - 2016

Introduccin
a
Visual
Studio.Net

Introduccin a Visual
Visual Studio 2010 es
un entorno de desarrollo integrado para
Studio.Net

sistemas

operativos. Soporta varios lenguajes de programacin como Visual C++, Visual

C#, Visual J#, y Visual Basic .NET, al igual que entornos de desarrollo web como
ASP.NET.
Visual Studio permite a los desarrolladores crear aplicaciones, sitios y
aplicaciones web, as como servicios web en cualquier entorno que soporte la
plataforma .NET a partir de la versin .NET 2002. As se pueden crear
aplicaciones que se intercomuniquen entre frecuencias de trabajo, pginas web
y dispositivos mviles.
Microsoft Visual Studio es una coleccin completa de herramientas y servicios
para desarrollar aplicaciones para equipos de escritorio, la Web, dispositivos y la
nube. Tanto si va a crear su primera aplicacin para la Tienda Windows como si
va a compilar un sitio web compatible con los ltimos exploradores, puede
aprovechar los conocimientos que ya tiene con el entorno de desarrollo
vanguardista que ofrece Visual Studio para lenguajes .NET, HTML/JavaScript y
C++.
Visual Studio proporciona un entorno de colaboracin flexible que permite
conectar con otras herramientas de desarrollo, como Eclipse y Xcode.

Entorno de Desarrollo de
Microsoft Visual Studio.Net
IDE con la configuracin de desarrollo general aplicada

Explorador de soluciones

Diseador de pginas Web, vista Diseo

Diseador de pginas Web, vista Cdigo fuente

Diseador de pginas web, Vista dividida

Ventana de salida con informacin de compilacin

Formulario de Visual Basic en el modo de interrupcin

Ventanas de herramientas de depuracin

Asistente para publicacin

Editor del sistema de archivos

Ayuda en la ventana del explorador

Creacin de Sitios Web

Para crear un sitio web del sistema de archivos

1.

Abrir Visual Studio 2010 o 2012.

2. En el men Archivo, haga clic en Nuevo sitio Web.

3. El cuadro de dilogo Nuevo sitio web aparece, como se muestra en la

siguiente ilustracin:

4. En Plantillas instaladas, haga clic en C# y, luego clic Sitio web

ASP.NET.
Al crear un proyecto de sitio web, especifica una plantilla. Cada
plantilla crea un proyecto Web que contiene archivos diferentes y
carpetas.
5. En el cuadro Ubicacin Web (Web Location), elija Sistema de archivos
y a continuacin, escriba el nombre de la carpeta donde desea
mantener las pginas de su sitio web.
Por ejemplo, escriba el nombre de carpeta C:\Users\yomira\Desktop\WebSite1.
6. Haga clic en Aceptar.
Visual Studio crea un Sitio Web que incluye la funcionalidad del
prebuilt para el diseo una pgina maestra, las pginas de contenido
de About.aspx y Default.aspx y una hoja de estilos en cascada, para
Ajax archivos de script de cliente, y para la autenticacin pertenencia
ASP.NET. Cuando se crea una nueva pgina, de forma
predeterminada Visual Studio muestra la pgina en vista Cdigo
fuente, donde puede ver los elementos HTML de la pgina.

Este es el entorno de Visual Studio

Para familiarizarse con el diseador de Web debemos de tener en cuenta lo

siguiente:

Barras de herramientas (Toolbars): Proporcionan los comandos que

permiten dar formato al texto, buscar texto, etc. Algunas barras de
herramientas slo estn disponibles cuando se trabaja en la vista
Diseo.
Ventana Explorador de soluciones (Solution Explorer): Muestra los
archivos y carpetas del sitio Web.
Ventana Documento (Document Window): Muestra los documentos

en los que se est trabajando en ventanas con fichas. Puede pasar de

un documento a otro haciendo clic en las fichas.
Ventana Propiedades (Properties Window): Permite cambiar la
configuracin de la pgina, los elementos HTML, los controles y otros
objetos.
Fichas de vistas (View tabs): Presentan distintas vistas del mismo
documento. La vista Diseo es un rea de edicin prcticamente
WYSIWYG. La vista Cdigo fuente es el editor HTML de la pgina.
Divida las presentaciones de la vista la vista Diseo y la vista Cdigo
fuente para el documento. Trabajar con las vistas Diseo y Cdigo
fuente ms adelante en este tutorial. Si prefiere abrir las pginas web
en la vista Diseo, en el men Herramientas haga clic en Opciones,
seleccione el nodo Diseador HTML y cambie la opcin Iniciar pginas
en.
Cuadro de herramientas (Toolbox): Proporciona los controles y
elementos HTML que se pueden arrastrar a la pgina. Los elementos
del Cuadro de herramientas se agrupan por funcionamiento comn.

Explorador de servidores/Explorador de bases de datos (Server

Explorer): Muestra las conexiones de las bases de datos. Si Explorador
de servidores no est visible, en el men Ver, haga clic en Explorador
de servidores o Explorador de bases de datos.
Crear una Nueva Pgina de los formularios Web Forms ASP.NET
Al crear un nuevo sitio web mediante la plantilla de proyecto de Sitio web
ASP.NET, Visual Studio agrega una pgina ASP.NET pgina de formularios
Web Forms denominada Default.aspx. Puede utilizar la pgina Default.aspx
como pgina principal de su sitio web.
Para agregar una pgina al sitio Web
1. Cierre la pgina Default.aspx. Para ello, haga clic con el botn
secundario en la pestaa que muestra el nombre de archivo y, a
continuacin, hace clic en Cerrar.
2. En Explorador de soluciones, haga clic con el botn secundario en el
sitio web (por ejemplo, C:\Users\yomira\Desktop\WebSite1) y, a
continuacin, haga clic en Agregar nuevo elemento.
3. Se abrir el cuadro de dilogo Agregar nuevo elemento. La siguiente
ilustracin muestra un ejemplo del cuadro de dilogo Agregar nuevo
elemento.

4. En la lista de plantillas, seleccione Formulario Web Forms.

5. En el cuadro Nombre, escriba MiPrimeraPaginaWeb.
6. Cuando cre el proyecto de sitio web, especific que un
idioma predeterminado bas en la plantilla de proyecto que
seleccion. Sin embargo, cada vez que se crea una pgina o
un componente nuevo para el sitio web, se puede seleccionar
el lenguaje de programacin para esa pgina o componente.
Puede utilizar diferentes lenguajes de programacin en el
mismo sitio Web.
7. Haga clic en Agregar (Add).
8. Visual Studio crea la nueva pgina y la abre.

Para agregar texto a la pgina

1. En la parte inferior de la ventana de documento, haga clic en la ficha
Diseo para pasar a la vista Diseo.
La Vista de diseo muestra la pgina en la que se est trabajando
en modo WYSIWYG. En este momento, no hay texto ni controles en
la pgina, por lo que est en blanco, aparte de una lnea discontinua
que forma un rectngulo
2. Haga clic en el interior del rectngulo formado por la lnea discontinua.
3. Escriba Bienvenido a Visual Studio 2010 y presione ENTER dos veces.
La siguiente ilustracin muestra el texto que escribi en la Vista de
diseo.

4. Cambie a la vista Cdigo fuente.

Puede ver el cdigo HTML que ha creado escribiendo en la Vista de
diseo, como se muestra en la ilustracin siguiente.

Ejecutar la pgina
Antes de continuar agregando controles a la pgina, puede intentar ejecutarla.
Para ejecutar una pgina, necesita un servidor web. En un sitio Web de
produccin, se utiliza IIS como servidor web. Sin embargo, para probar una
pgina, puede utilizar el Servidor de desarrollo de Visual Studio, que se
ejecuta localmente y no requiere IIS. Para los proyectos de sitio web de
sistema de archivos, el servidor web predeterminado en Visual Studio y
Microsoft Visual Web Developer Express es el Servidor de desarrollo de Visual
Studio.
Para ejecutar la pgina
1. En el Explorador de soluciones, haga clic con el botn secundario del
mouse en MiPrimeraPaginaWeb.aspx y seleccione Establecer como
pgina principal.
2. Presione CTRL+F5 para ejecutar la pgina.

Visual Studio inicia el Servidor de desarrollo de Visual

Studio. Un icono aparece en la barra de tareas de Windows
para indicar que el Servidor de desarrollo de Visual Studio
se est ejecutando, como se muestra en la ilustracin.
3. La pgina se muestra en el explorador. Aunque la pgina que cre tiene
una extensin de nombre de archivo de .aspx, ejecuta actualmente
como cualquier pgina HTML.
4. Para mostrar una pgina en el explorador, tambin se puede hacer clic
con el botn secundario del mouse en la pgina en el Explorador de
soluciones y seleccionar Ver en el explorador.
5. Cierre el explorador.
Agregar y programar controles
Ahora agregar controles de servidor a la pgina. Los controles de servidor, entre
los que se incluyen botones, etiquetas, cuadros de texto y otros controles
familiares, proporcionan las funciones tpicas de procesamiento de formularios
para las pginas Web ASP.NET. Sin embargo, puede programar los controles con
cdigo que se ejecuta en el servidor, no el cliente.
Agregar un control Button, un control TextBox y un control Label a la pgina y
cdigo de la escritura para administrar el evento Click para el control Button.
Para agregar controles a la pgina
1. Haga clic en la pestaa Diseo para cambiar a la Vista de diseo.
2. Site el punto de insercin al final del texto "Bienvenido a Visual
Studio 2010" y presione ENTER al menos cinco veces para ampliar
el espacio del cuadro del elemento div.
3. En el Cuadro de herramientas, expanda el grupo Estndar.
4. Arrastre un control TextBox a la pgina y colquelo en el medio del
cuadro de elemento div que tiene Inicio a Visual Web Developer en
la primera lnea.
5. Arrastre un control Button a la pgina y colquelo al derecho del
control TextBox.

6. Arrastre un control Label a la pgina y colquelo en una lnea

independiente debajo del control Button, luego cambie la propiedad
ID del label por lblNombre. Con este ID reconoceremos al control en
la aplicacin.
7. Site el punto de insercin encima del control TextBox y, a
continuacin, escriba el texto "Escriba su nombre:".
Este texto HTML esttico es el ttulo del control TextBox. Puede mezclar
HTML esttico y controles de servidor en la misma pgina. La siguiente
ilustracin muestra cmo aparecen los tres controles en la Vista de
diseo.
Establecer las propiedades de los controles
Visual Studio ofrece muchas maneras de establecer las propiedades de
controles en la pgina.
Para establecer las propiedades de los controles
1. Seleccione el control Button, y a continuacin en la ventana
Propiedades, coloque la propiedad texto Agregar. El texto que escribi
aparece en el botn en el diseador, como se muestra en la siguiente

ilustracin.

2. Cambie a la vista Cdigo fuente.

La vista Cdigo fuente muestra el HTML para la pgina, incluso los
elementos que Visual Studio ha creado para los controles de
servidor. Los controles se declaran utilizando sintaxis de tipo
HTML, con la excepcin de que las etiquetas utilizan el prefijo asp
e incluyen el atributo runat="server".
Las propiedades del control se declaran como atributos. Por
ejemplo, cuando estableci la propiedad Text del control Button en
el paso 1, en realidad estableci el atributo Text del marcado del
control.
Observe que todos los controles estn dentro de un elemento form,
que tambin tiene el atributo runat="server". El atributo
runat="server" y el prefijo asp de las etiquetas de los controles
marcan los controles para que ASP.NET los procese en el servidor
cuando se ejecuta la pgina. El cdigo que se encuentra fuera de
los elementos <form runat="server"> y <script runat="server"> se
enva sin cambios al explorador; este es el motivo por el que el
cdigo ASP.NET debe estar dentro de un elemento cuya etiqueta
de apertura contiene el atributo runat="server".
3. Site el punto de insercin detrs de asp:Label en la etiqueta
<asp:Label> y, a continuacin, presione la BARRA
ESPACIADORA.
Aparece una lista desplegable que muestra las propiedades que se
pueden establecer para un control Label. Esta caracterstica,
denominada IntelliSense, ayuda en la vista Cdigo fuente con la
sintaxis de los controles de servidor, los elementos HTML y otros
elementos de la pgina. La siguiente ilustracin muestra la lista
desplegable de IntelliSense para el control Label.

4. Seleccione ForeColor y, a continuacin, escriba un signo igual y comillas

(=").
IntelliSense muestra una lista de colores.
5. Seleccione un color para el texto del control Label. Asegrese
de seleccionar un color suficientemente oscuro para que se
pueda leer el texto sobre un fondo de color blanco.
El atributo ForeColor se completa con el color que ha
seleccionado, incluidas las comillas de cierre.
Programar el control Button
En este ejercicio, escribiremos el cdigo que lee el nombre
especificado por el usuario en el cuadro de texto y lo muestra en el
Label.
Para agregar un controlador de eventos de botn predeterminado
1. Cambie a la vista Diseo.
2. Haga doble clic en el control Button.
Visual Studio intercambia a la vista Cdigo fuente y crea un
esquema del controlador de eventos para el evento
predeterminado de control Button, el evento Click.
3. Dentro del controlador, escriba lblNombre seguido por un punto (.).
Al escribir el punto despus de Etiqueta, Visual Studio muestra
una lista de miembros disponibles para el control Label
(lblNombre), como se muestra en la siguiente ilustracin.

4. Complete el controlador de eventos Click para el botn de

manera que tenga el aspecto mostrado en el ejemplo de

cdigo siguiente.
5. Deslizar hasta el elemento <asp:Button>. Observe que el
elemento
<asp:Button> tiene ahora el atributo onclick="btnAceptar_Click".
Este atributo enlaza el evento Click del botn al mtodo de
controlador que codific en el paso anterior.
Los mtodos de control de eventos pueden tener cualquier
nombre; el nombre que ve es el nombre predeterminado
creado por Visual Studio. Lo importante es que el nombre
utilizado para el atributo onclick debe coincidir con el nombre
de un mtodo de la pgina.
Para ejecutar la pgina
1. Presione CTRL+F5 para ejecutar la pgina en el explorador.
La pgina se ejecuta de nuevo, utilizando el Servidor de desarrollo de
Visual Studio.
2. Escriba un nombre en el cuadro de texto y haga clic en el botn.
El nombre especificado se muestra en el control Label. Tenga en cuenta
que cuando se hace clic en el botn, la pgina se publica en el servidor
web. ASP.NET vuelve a crear la pgina, ejecuta el cdigo (en este caso,
se ejecuta el controlador de eventos Click del control Button) y enva la
nueva pgina al explorador.
3. En el explorador, vea el cdigo fuente de la pgina que est ejecutando.
En el cdigo fuente de la pgina, solo se ve HTML ordinario; no se ven
los elementos <asp:> con los que ha trabajado en la vista Cdigo
fuente. Cuando la pgina se ejecuta, ASP.NET procesa los controles de
servidor y representa en la pgina los elementos HTML que realizan las
funciones que representan el control. Por ejemplo, el control
<asp:Button> se representa como el elemento
<input type="submit"> de HTML.
4. Cierre el explorador.

Trabajar con controles adicionales

En esta parte del tutorial, trabajar con el control Calendar, que muestra las
fechas mes por mes. El control Calendar es ms complejo que los controles
de botn, cuadro de texto y etiqueta con los que ha trabajado, e ilustra algunas
funciones adicionales de los controles de servidor.
Para agregar un control Calendar
1. En Visual Studio, intercambie a la vista Diseo.
2. De la seccin Estndar del Cuadro de herramientas, arrastre un control
Calendar a la pgina y colquelo debajo del elemento div que contiene
los otros controles:
Aparece el panel de etiquetas inteligentes del calendario. El panel
muestra comandos que ayudan a realizar las tareas ms comunes del
control seleccionado. En la siguiente ilustracin se muestra cmo se
presenta el control Calendar en la Vista de diseo.

3. En el panel de etiquetas inteligentes, elija Formato automtico.

Se muestra el cuadro de dilogo Formato automtico, que permite
seleccionar un esquema de formato para el calendario. La siguiente
ilustracin muestra el cuadro de dilogo Formato automtico para el
control Calendar.

4. En la lista Seleccionar esquema, seleccione Simple y, a continuacin,

haga clic en Aceptar.
5. Cambie a la vista Cdigo fuente.
Puede ver el elemento <asp:Calendar>. Este elemento es mucho
ms largo que los elementos de los controles sencillos creados
anteriormente.
Tambin
incluye
subelementos,
como
<WeekEndDayStyle>, que representa las distintas configuraciones
de formato. En la siguiente ilustracin se muestra el control Calendar
en la vista Cdigo fuente. (El marcado exacto que ve en vista
Cdigo fuente podra diferir ligeramente de la ilustracin.)

Programar el control Calendar

En esta seccin, programar el control Calendar para que muestre la
fecha actualmente seleccionada.
Para programar el control Calendar
1. En vista Diseo, haga doble clic en el control Calendar.
Un nuevo controlador de eventos se crea en la vista Cdigo fuente.
2. Complete el controlador de eventos SelectionChanged con el
cdigo resaltado siguiente.

Para ejecutar la pgina

1. Presione CTRL+F5 para ejecutar la pgina en el explorador.
2. Haga clic en una fecha del calendario.
La fecha especificada se muestra en el control Label.
3. En el explorador, vea el cdigo fuente de la pgina.
El control Calendar se ha representado en la pgina como una
tabla, con cada da como un elemento td que contiene un
elemento a.
4. Cierre el explorador.

Elementos
del
Lenguaje
Visual

Tipos de datos
IDENTIFICADORES
En C# un identificador es un nombre con el que identificaremos algn
elemento de nuestro cdigo, ya sea una clase, una variable, un mtodo,
etc. El nombre de un identificador ser una secuencia de cualquier
nmero de caracteres alfanumricos tales que el primero de ellos no sea
un nmero.

OPERADORES
Un operador en es un smbolo formado por uno o ms caracteres que
permite realizar una determinada operacin entre uno o ms datos
(operando) y produce un resultado.
1. Operadores aritmticas: Los operadores aritmticos incluidos en
C# son: suma (+), resta (), producto (*), divisin (/) y mdulo (%)
Tambin se incluyen operadores de menos unario ( ) y ms
unario (+ +).
2. Operaciones lgicas: Se incluyen operadores que permiten
realizar las operaciones lgicas tpicas: and (& & y &), or (|
| y |), not (!) y xor (^).
3. Operadores relacionales: Se han incluido los operadores de
igualdad (= =), desigualdad (! =), mayor que (>), menor que (<),
mayor o igual que (> =) y menor o igual que (< =).
4. Operador de asignacin: Para realizar asignaciones se usa en
C# el operador=, operador que adems de realizar la asignacin
que se le solicita devuelve el valor asignado. Por ejemplo, la
expresin a = b asigna a la variable a el valor de la variable b y
devuelve dicho valor, mientras que la expresin c = a = b asigna a
c y a el valor de b (el operador = es asociativo por la derecha)
5. Operadores de asignacin compuestos: Tambin se incluyen
operadores de asignacin compuestos que permiten ahorrar
tecleo a la hora de realizar asignaciones comunes. Son
operadores de asignacin compuestos: + =, =, * =,/ =.

6. Operadores de concatenacin: Para realizar operaciones de

concatenacin (unin) de cadenas se puede usar el mismo

operador que para realizar sumas (+).
TIPOS DE DATOS BSICOS
Los tipos de datos bsicos son elementos de datos que permiten definir
el tipo a las variables, constantes, parmetros, etc., para que C# reserve
un espaci en memoria de acuerdo al tipo y al tamao de estos, as
mismo para efecto de tratamiento al momentos de utilizarlos.
A continuacin se presenta una tabla con los principales tipos de datos
en C#
Tipo

Descripcin

Bits

Rango de valores

Alias

SByte

Bytes con signo

-128 127

sbyte

Byte

Bytes sin signo

0 255

Byte

Int16

Enteros cortos con

signo
Enteros cortos sin
signo
Enteros normales

16

[-32.768, 32.767]

Short

16

[0, 65.535]

ushort

32

Int

Enteros normales
sin signo
Enteros largos

32

[-2.147.483.648,
2.147.483.647]
[0, 4.294.967.295]

Long

UInt64

Enteros largos sin

signo

64

Single

Reales
con
7
dgitos de precisin

32

[9.223.372.036.854
.775.808,9.223.37
2.036.854.775.807
]
[018.446.744.073.70
9.551.615]
[1,510-45
3,41038]

Double

Reales de 15-16
dgitos de precisin

64

[5,010-324
1,710308]

double

Decimal

Reales de 28-29
dgitos de precisin

128

[1,010-28
7,91028]

decimal

Boolean

Valores lgicos

32

true, false

Bool

Char

Caracteres Unicode

16

Char

String

Cadenas
de Varia
caracteres
ble
Cualquier objeto
Varia
ble

[\u0000,
\uFFFF]
El permitido por la
memoria
Cualquier objeto

UInt16
Int32
UInt32
Int64

Object

64

Uint

Ulong

Float

string

Palabras Reservadas
DATABASE

IGNORE

ADD

DATE

IMP

ALL

DATETIME

IN

ALTER

INDEX

AND

DELETE

INT

ANY

DESC

AS

DISALLOW

ASC

DISTINCT

INTEGER

AUTOINCREMENT

DISTINCTROW

INTEGER1

AVA

DOUBLE

INTEGER2

BETWEEN

DROP

INTEGER4

BINARY

EXISTS

INTO

BIT

FROM

IS

BOOLEAN

FLOAT

JOIN

BY CREATE

FLOAT4

KEY

BYTE

FLOAT8

LEFT

CHAR

FOREIGN

LEVEL

CHARACTER

GENERAL

LIKE

COLUMN

GROUP

LOGICAL

CONSTRAINT

GUID

LONG

COUNT

HAVING

LONGBINARY

COUNTER

INNER

LONGTEXT

CURRENCY

INSERT

MAX

MEMO

NOT

OLEOBJECT

MIN

NULL

ON PIVOT

MOD

NUMBER

MONEY

NUMERIC

OPTION PRIMARY

OWNERACCESS

REAL

ORDER

PARAMETERS

REFERENCES

OUTER

PERCENT

RIGHT

SELECT

STDEV

TEXT

SET

STDEVP

TIME

SHORT

STRING

TIMESTAMP

SINGLE

SUM

TOP

SMALLINT

TABLE

TRANSFORM

SOME

TABLEID

UNION

UNIQUE

VAR

WHERE

UPDATE

VARBINARY

WITH

VALUE

VARCHAR

YESNO

VALUES

VARP

Comentarios
<%
response.write("linea sin comentar")
' al poner el apostrofe la linea no se mostrar en el
navegador
' response.write("linea comentada")
%>

Sintaxis del Lenguaje

Sintaxis de los controles de servidor Validation
Los controles de servidor de validacin permiten comprobar los datos
especificados por el usuario en los controles de servidor ASP.NET como
un TextBox y permiten mostrar un mensaje personalizado si se genera un
error de validacin. Cada control de validacin realiza un tipo
determinado de validacin. Por ejemplo, se puede comprobar un valor
especfico

un

intervalo

de

valores

mediante

los

controles CompareValidator y RangeValidator, respectivamente.

Se pueden definir asimismo criterios de validacin propios mediante el
control CustomValidator. Se puede especificar la ubicacin de un
mensaje de error en la pgina Web colocando un control de validacin en
el lugar donde debe aparecer el mensaje. Tambin se puede mostrar un
resumen de los resultados de todos los controles de validacin en la
pgina mediante el control ValidationSummary.
De manera predeterminada, se realiza la validacin de la pgina cuando
se

hace

clic

en

un

control

de

botn

como Button,ImageButton o LinkButton. Para impedir que se realice la

validacin al hacerse clic en un control de botn, se debe establecer el

valor de la propiedad CausesValidation del control de botn en false. El
valor de esta propiedad suele estar establecido en false para un botn
que permite cancelar o borrar con el fin de impedir que se realice la
validacin cuando se hace clic en el botn.
En los siguientes temas se recoge la sintaxis ASP.NET para los controles
de validacin. Estos temas incluyen informacin sobre todas las
propiedades que comparten los controles de validacin as como las
propiedades especficas de cada control que se pueden declarar como
atributo en la etiqueta de apertura de un control especificado.

ATRIBUTOS
class
Especifica la clase de .NET Framework que se va a crear.
classID
Especifica el componente COM que se va a crear utilizando el
identificador de clase del componente.
id
Nombre nico utilizado cuando se hace referencia al objeto en el
siguiente cdigo.
lateBinding
Indica si se deben utilizar API de enlace en tiempo de ejecucin
con los componentes COM procesados por el importador de la

biblioteca de tipos (Tlbimp.exe). El valor true indica que deben

utilizarse

API

de

enlace

en

tiempo

de

ejecucin;

el

valor false indica que deben utilizarse API de enlace en tiempo de

compilacin. El valor predeterminado es false.
progID
Especifica el componente COM que se va a crear indicando el
identificador de programacin del componente.
runat
Su valor debe establecerse en server para que el objeto se
ejecute en ASP.NET. Cualquier valor distinto de server har que el
compilador

de

pginas

suponga

que

debe

etiqueta <object> al cliente para su procesamiento.

enviarse

la

Implementaci
n
de clases
en C#. Net.

Introduccin a
Programacin
Orientada a Objetos

Es importante aclarar desde un principio la diferencia que existe entre

programacin orientada a objetos y un lenguaje orientado a objetos. La
programacin orientada a objetos es una filosofa, un modelo de
programacin, con su teora y su metodologa, que conviene conocer y
estudiar antes de nada. Un lenguaje orientado a objetos es un lenguaje
de programacin que permite el diseo de aplicaciones orientadas a
objetos. Dicho esto, lo normal es que toda persona que vaya a
desarrollar aplicaciones orientadas a objetos aprenda primero la
filosofa (o adquiera la forma de pensar) y despus el lenguaje, porque
filosofa slo hay una y lenguajes muchos. En este documento veremos
brevemente los conceptos bsicos de la programacin orientada a
objetos desde un punto de vista global, sin particularizar para ningn
lenguaje de programacin especfico.

Concepto de Orientacin a
Objetos
La programacin orientada a objetos es una filosofa, un modelo de
programacin, con su teora y su metodologa, que conviene conocer y
estudiar antes de nada. Un lenguaje orientado a objetos es un lenguaje
de programacin que permite el diseo de aplicaciones orientadas a
objetos. Dicho esto, lo normal es que toda persona que vaya a
desarrollar aplicaciones orientadas a objetos aprenda primero la
filosofa (o adquiera la forma de pensar) y despus el lenguaje, porque
filosofa slo hay una y lenguajes muchos. En este documento veremos
brevemente los conceptos bsicos de la programacin orientada a
objetos desde un punto de vista global, sin particularizar para ningn
lenguaje de programacin especfico.

Propiedades de la
Programacin
Orientada
a Objetos
Implementar
una
clase
ligera
con
propiedades

Cmo:
autoimplementadas.
Visual Studio 2010

En este ejemplo se muestra cmo crear una clase ligera inmutable que
solo

sirve

para

encapsular

un

conjunto

de

propiedades

autoimplementadas. Use este tipo de construccin en lugar de un struct

cuando deba utilizar una semntica de tipo de referencia.
Puede crear una propiedad inmutable de dos maneras. Puede declarar el
descriptor de acceso set como private. La propiedad solo se puede
establecer dentro del tipo, pero es inmutable a los consumidores. En su
lugar puede declarar solo el descriptor de acceso get, que hace que la
propiedad sea inmutable en cualquier lugar excepto en el constructor del
tipo.
Cuando se declara un descriptor de acceso set privado, no se puede
usar un inicializador de objeto para inicializar la propiedad. Se debe
utilizar un constructor o un mtodo factory.
En el siguiente ejemplo se muestran dos maneras de implementar una
clase inmutable que tenga propiedades autoimplementadas. Cada forma
declara una de las propiedades con un set privado y una de las
propiedades solamente con un get. La primera clase usa un constructor
solo para inicializar las propiedades y la segunda clase utiliza un mtodo
factory esttico que llama a un constructor.

// This class is immutable. After an object is created,

// it cannot be modified from outside the class. It uses a
// constructor to initialize its properties.
class Contact
{
// Read-only properties.
public string Name { get; }
public string Address { get; private set; }

// Public constructor.
public Contact(string contactName, string contactAddress)
{
Name = contactName;
Address = contactAddress;
}
}

// This class is immutable. After an object is created,

// it cannot be modified from outside the class. It uses a
// static method and private constructor to initialize its
properties.
public class Contact2
{
// Read-only properties.
public string Name { get; private set; }
public string Address { get; }

// Private constructor.

private Contact2(string contactName, string

contactAddress)
{
Name = contactName;
Address = contactAddress;
}
// Public factory method.
public static Contact2 CreateContact(string name, string
address)
{
return new Contact2(name, address);
}
}

public class Program

{
static void Main()
{
// Some simple data sources.
string[] names = {"Terry Adams","Fadi Fakhouri",
"Hanying Feng",
"Cesar Garcia", "Debra Garcia"};
string[] addresses = {"123 Main St.", "345 Cypress
Ave.", "678 1st Ave",
"12 108th St.", "89 E. 42nd
St."};

// Simple query to demonstrate object creation in

select clause.

// Create Contact objects by using a constructor.

var query1 = from i in Enumerable.Range(0, 5)
select new Contact(names[i],
addresses[i]);

// List elements cannot be modified by client code.

var list = query1.ToList();
foreach (var contact in list)
{
Console.WriteLine("{0}, {1}", contact.Name,
contact.Address);
}

// Create Contact2 objects by using a static factory

method.
var query2 = from i in Enumerable.Range(0, 5)
select Contact2.CreateContact(names[i],
addresses[i]);

// Console output is identical to query1.

var list2 = query2.ToList();

// List elements cannot be modified by client code.

// CS0272:
// list2[0].Name = "Eugene Zabokritski";

// Keep the console open in debug mode.

Console.WriteLine("Press any key to exit.");
Console.ReadKey();

}
}

/* Output:
Terry Adams, 123 Main St.
Fadi Fakhouri, 345 Cypress Ave.
Hanying Feng, 678 1st Ave
Cesar Garcia, 12 108th St.
Debra Garcia, 89 E. 42nd St.
*/

Clases
Una clase es una construccin que permite crear tipos personalizados
propios mediante la agrupacin de variables de otros tipos, mtodos y
eventos. Una clase es como un plano. Define los datos y el
comportamiento de un tipo. Si la clase no se declara como esttica, el
cdigo

de

cliente

puede

utilizarla

mediante

la

creacin

de objetos o instancias que se asignan a una variable.

Declarar clases
Las clases se declaran mediante la palabra clave class, tal como se
muestra en el ejemplo siguiente:
public class Customer
{
//Fields, properties, methods and events go here...
}

El nivel de acceso precede a la palabra clave class. Como, en este caso,

se utiliza public, cualquiera puede crear objetos a partir de esta clase. El

nombre de la clase sigue a la palabra clave class. El resto de la

definicin es el cuerpo de clase, donde se definen el comportamiento y
los datos. Los campos, propiedades, mtodos y eventos de una clase se
conocen colectivamente como miembros de clase.

Crear objetos
Aunque se utilizan a veces de forma intercambiable, una clase y un
objeto son cosas diferentes. Una clase define un tipo de objeto, pero no
es propiamente un objeto. Un objeto es una entidad concreta basada en
una clase y, a veces, se denomina instancia de una clase.
Los objetos se pueden crear con la palabra clave new seguida del
nombre de la clase en la que se basar el objeto, de la manera siguiente:
Customer object1 = new Customer();

Cuando se crea una instancia de una clase, una referencia al objeto se

vuelve a pasar al programador.En el ejemplo anterior,object1 es una
referencia a un objeto basado en Customer. Esta referencia apunta al
nuevo objeto, pero no contiene los datos del objeto. De hecho, se puede
crear una referencia a objeto sin crear un objeto:
Customer object2;

No se recomienda crear este tipo de referencias que realmente no

apuntan a un objeto existente, ya que al intentar el acceso a un objeto a
travs de esa referencia se producir un error en tiempo de ejecucin. No
obstante, este tipo de referencia se puede crear para hacer referencia a

un objeto, ya sea creando un nuevo objeto o asignndola a un objeto

existente, de la forma siguiente:
Customer object3 = new Customer();
Customer object4 = object3;

Este cdigo crea dos referencias a objeto que se refieren al mismo

objeto. Por consiguiente, los cambios realizados en el objeto a travs
de object3 se reflejarn en los usos posteriores de object4. Puesto que el
acceso a los objetos basados en clases se realiza por referencia, las
clases se denominan tipos por referencia.

Herencia de clase
La herencia se realiza a travs de una derivacin, lo que significa que
una clase se declara utilizando una clase base de la cual hereda los
datos y el comportamiento.
Ejemplo:

public class Manager : Employee

{
// Employee fields, properties, methods and events are
inherited
// New Manager fields, properties, methods and events go
here...
}

Cuando una clase declara una clase base, hereda todos los miembros de
la clase base excepto los constructores.
A diferencia de C++, una clase en C# solo puede heredar directamente
de una clase base. Sin embargo, dado que una clase base puede
heredar de otra clase, una clase puede heredar indirectamente de varias
clases base. Adems, una clase puede implementar directamente ms
de una interfaz.
Una clase se puede declarar como abstracta. Una clase abstracta
contiene mtodos abstractos que incluyen una definicin de firma pero
ninguna implementacin. No se pueden crear instancias de las clases
abstractas. Solo se pueden utilizar a travs de clases derivadas que
implementan

los

mtodos

abstractos.

Por

el

contrario,

una

clase sellada no permite que otras clases deriven de ella.

Como agregar una clase

Para agregar una clase vemos en la parte derecha del programa
EXPLORADOR DE SOLUCIONES luego le damos clic derecho en web
config

se nos despliega una lista en la que encontraras

AGREGAR NUEVO ELEMENTO o ms prctico Ctrl+Mayus.+A hacemos

clic

Se despliega otra ventana donde buscaras CLASE le damos clic y luego

miras en que carpeta vas a ubicar la clase y clic AGREGAR.

REPRESENTACIN
En el ejemplo siguiente, se define una clase pblica que contiene un
campo nico, un mtodo y un mtodo especial denominado constructor.
Luego se crean instancias de la clase con la palabra clave new.
public class Persona
{
// Field
public string name;

// Constructor that takes no arguments.

public Persona()
{
name = "unknown";
}
// Constructor that takes one argument.

public Persona(string nm)

{
name = nm;
}

// Method
public void SetName(string newName)
{
name = newName;
}
}
class TestPersona
{
static void Main()
{
// Call the constructor that has no parameters.
Persona persona1 = new Persona();
Console.WriteLine(persona1.name);

persona1.SetName("John Smith");
Console.WriteLine(persona1.name);
// Call the constructor that has one parameter.
Person person2 = new Persona("Sarah Jones");
Console.WriteLine(person2.name);
// Keep the console window open in debug mode.
Console.WriteLine("Press any key to exit.");
Console.ReadKey();
}
}
// Output:

// unknown
// John Smith
// Sarah Jones

Web Forms
y
Acceso a
Datos

Introduccin al acceso
a datos en las pginas
de formularios Web
Varias pginas de formularios Web FormsForms
implican obtener acceso a
datos para mostrarlos y, que permite a los usuarios modificar y actualizar
dichos datos. Conocer la tecnologa de acceso a datos en las pginas de
formularios Web Forms ayuda a crear aplicaciones Web eficaces.
Las pginas de formularios Web Forms a menudo precisan mostrar
informacin derivada de una base de datos, un documento o una
secuencia XML, o cualquier otro origen de datos. La arquitectura de las
pginas de formularios Web Forms permite incorporar los orgenes de
datos (o referencias a ellos) a la pgina para enlazar controles con los
datos y para manipular los datos de modos diversos.
Entonces, debido a la naturaleza de las pginas de formularios Web
Forms, as como de la programacin Web en s misma, el acceso a datos
en las pginas de formularios Web Forms difiere en varias aspectos del
acceso a datos en los formularios Windows Forms o en la tecnologa de
formularios de productos Microsoft anteriores.
De algn modo, estas son las mismas diferencias que hacen cualquier
tipo de programacin Web distinta de la programacin de los formularios
tradicionales: la administracin del estado, la separacin entre cliente y
servidor, el diseo pensado para la escalabilidad, etc. Adems, al trabajar
con otros recursos como bases de datos, existen puntos importantes
sobre la administracin de los datos en las pginas de los formularios
Web Forms que hay que llegar a comprender.

Concepto Acceso a datos

El acceso a datos en las pginas de formularios Web Forms se basa en

los siguientes principios principales:

Utilizacin de un modelo desconectado

Mayor frecuencia de lectura de los datos que de su actualizacin

Reduccin al mximo de los requisitos de recursos del servidor

Acceso a los datos mediante procesos remotos (acceso a datos

distribuido)

Controles que se utilizan

en formularios Windows
Forms
A continuacin conocemos los controles y componentes que se pueden
utilizar en formularios Windows Forms. Adems de los controles de
formularios Windows Forms que se tratan en esta seccin, puede
agregar controles ActiveX y controles personalizados a los formularios
Windows Forms.

Controles de formularios Windows Forms por funcin

Enumera y describe los controles de formularios Windows Forms
basados en .NET Framework.
Controles compatibles con dibujos propietarios integrados
Describe cmo modificar aspectos de la apariencia de un control
que no estn disponibles mediante las propiedades.
BackgroundWorker (Componente)

Habilita un formulario o control para ejecutar de forma asincrnica

una operacin.

BindingNavigator (Control, formularios Windows Forms)

Proporciona la interfaz de usuario (IU) de navegacin y
manipulacin para controles que se enlazan a datos.
BindingSource (Componente)
Encapsula un origen de datos para enlazarlo a controles.
Button (Control, formularios Windows Forms)
Presenta un botn estndar en el que el usuario puede hacer clic
para realizar acciones.
CheckBox (Control, formularios Windows Forms)
Indica si una condicin est activa o inactiva
CheckedListBox (Control, formularios Windows Forms)
Muestra una lista de elementos con una casilla junto a cada uno
de ellos.
ColorDialog (Componente, formularios Windows Forms)
Permite que el usuario seleccione un color de una paleta en un
cuadro de dilogo configurado y que agregue colores
personalizados a la paleta.
ComboBox (Control, formularios Windows Forms)
Muestra datos en un cuadro combinado desplegable.
ContextMenu (Componente, formularios Windows Forms)
Proporciona a los usuarios un men de fcil acceso con los
comandos de uso ms frecuente asociados al objeto
seleccionado.
Aunque el control ContextMenuStrip viene a reemplazar y a
agregar funcionalidad al control ContextMenu de las versiones

anteriores, ContextMenu se conserva a efectos de compatibilidad

con versiones anteriores y uso futuro, si as lo desea.
ContextMenuStrip (Control)
Representa un men contextual. Aunque el control
ContextMenuStrip viene a reemplazar y a agregar funcionalidad al
control ContextMenu de las versiones anteriores, ContextMenu se
conserva a efectos de compatibilidad con versiones anteriores y
uso futuro, si as lo desea.
DataGrid (Control, formularios Windows Forms)
Muestra datos organizados en formato de tabla procedentes de un
conjunto de datos y permite actualizar el origen de datos.
DataGridView (Control, formularios Windows Forms)
Proporciona un sistema flexible y ampliable para mostrar y editar
datos en formato de tabla.
DateTimePicker (Control, formularios Windows Forms)
Permite al usuario seleccionar un solo elemento de una lista de
fechas y horas.
Controles y componentes de cuadros de dilogo (formularios
Windows Forms)
Describe un conjunto de controles que permite a los usuarios
llevar a cabo interacciones estndar con la aplicacin o el sistema.
DomainUpDown (Control, formularios Windows Forms)
Muestra cadenas de texto que un usuario puede examinar y
seleccionar.
ErrorProvider (Componente, Formularios Windows Forms)
Muestra informacin de error al usuario de forma no intrusiva.
FileDialog (Clase)
Proporciona funcionalidad de clase base para los cuadros de
dilogo de archivos.

FlowLayoutPanel (Control, formularios Windows Forms)

Representa un panel que dispone dinmicamente su contenido en
posicin horizontal o vertical.

FolderBrowserDialog (Componente, Formularios Windows

Forms)
Muestra una interfaz con la que los usuarios pueden buscar y
seleccionar un directorio o crear uno nuevo.
FontDialog (Componente, formularios Windows Forms)
Expone las fuentes actualmente instaladas en el sistema.
Control GroupBox (formularios Windows Forms)
Proporciona una agrupacin identificable para otros controles.
HelpProvider (Componente, formularios Windows Forms)
Asocia un archivo de Ayuda HTML a una aplicacin basada en
Windows.
Controles HScrollBar y VScrollBar (formularios Windows
Forms)
Permiten la navegacin por una lista de elementos o un gran
volumen de informacin; ste puede ser de forma horizontal o
vertical dentro de una aplicacin o control.
ImageList (Componente, formularios Windows Forms)
Muestra imgenes en otros controles.
Label (Control, formularios Windows Forms)
Muestra texto que no puede ser modificado por el usuario.
LinkLabel (Control, formularios Windows Forms)
Permite agregar vnculos de tipo Web a aplicaciones de Windows
Forms.
ListBox (Control, formularios Windows Forms)

Permite a los usuarios seleccionar uno o ms elementos de una

lista predefinida.

ListView (Control, formularios Windows Forms)

Muestra una lista de elementos con iconos, al estilo del Explorador
de Windows.
MainMenu (Componente, formularios Windows Forms)
Muestra un men en tiempo de ejecucin. Aunque el control
MenuStrip reemplaza y agrega funcionalidad al control MainMenu
de las versiones anteriores, MainMenu se conserva a efectos de
compatibilidad con versiones anteriores y uso futuro, si se desea.
MaskedTextBox (Control, formularios Windows Forms)
Restringe el formato de los datos proporcionados por el usuario en
formularios.
MenuStrip (Control de formularios Windows Forms)
Proporciona un sistema de mens para formularios. Aunque el
control MenuStrip reemplaza y agrega funcionalidad al control
MainMenu de las versiones anteriores, MainMenu se conserva a
efectos de compatibilidad con versiones anteriores y uso futuro, si
se desea.
MonthCalendar (Control, formularios Windows Forms)
Muestra una intuitiva interfaz grfica para que los usuarios vean y
establezcan informacin de fechas.
NotifyIcon (Componente, formularios Windows Forms)
Muestra iconos para procesos que se ejecutan en segundo plano
y que, de otro modo, no tendran interfaz de usuario.
NumericUpDown (Control, formularios Windows Forms)
Muestra nmeros que un usuario puede examinar y seleccionar.

OpenFileDialog (Componente, formularios Windows Forms)

Permite que los usuarios abran archivos mediante un cuadro de
dilogo preconfigurado.

PageSetupDialog (Componente, formularios Windows Forms)

Establece los detalles de impresin de la pgina a travs de un
cuadro de dilogo preconfigurado.
Control Panel (Windows Forms)
Proporciona una agrupacin identificable para otros controles y
permite su desplazamiento.
PictureBox (Control, formularios Windows Forms)
Muestra grficos en formato de mapa de bits, GIF, JPEG,
metarchivo o icono.
PrintDialog (Componente, formularios Windows Forms)
Selecciona una impresora, elige las pginas que se van a imprimir
y determina otros valores de configuracin relacionados con la
impresin.
PrintDocument (Componente, formularios Windows Forms)
Establece las propiedades que describen qu se va a imprimir e
imprime el documento en aplicaciones basadas en Windows.
PrintPreviewControl (Control, formularios Windows Forms)
Permite crear un componente o cuadro de dilogo PrintPreview
propio en lugar de utilizar la versin preconfigurada.
PrintPreviewDialog (Control, formularios Windows Forms)
Muestra un documento tal como aparecer cuando se imprima.
ProgressBar (Control de formularios Windows Forms)

Indica grficamente el progreso de una accin hacia su

finalizacin.
RadioButton (Control, formularios Windows Forms)
Presenta al usuario un conjunto de dos o ms opciones
excluyentes entre s.

RichTextBox (Control, formularios Windows Forms)

Permite que los usuarios escriban, muestren y manipulen texto
con formato.
SaveFileDialog (Componente, formularios Windows Forms)
Selecciona los archivos que se van a guardar y el lugar en el que
se guardarn.
SoundPlayer (Clase)
Permite incluir con facilidad sonidos en las aplicaciones.
SplitContainer (Control, formularios Windows Forms)
Permite al usuario cambiar el tamao de un control acoplado.
Splitter (Control, formularios Windows Forms)
Permite al usuario cambiar el tamao de un control acoplado
(.NET Framework versin 1.x).
StatusBar (Control de formularios Windows Forms)
Muestra informacin de estado relacionada con el control que
tiene el foco.Aunque el control StatusStrip reemplaza y ampla al
control StatusBar respecto a las versiones anteriores, StatusBar
se conserva a efectos de compatibilidad con versiones anteriores
y uso futuro, si se desea.
StatusStrip (Control)

Representa un control de barra de estado de Windows.Aunque el

control StatusStrip reemplaza y ampla al control StatusBar
respecto a las versiones anteriores, StatusBar se conserva a
efectos de compatibilidad con versiones anteriores y uso futuro, si
se desea.
TabControl (Control, formularios Windows Forms)
Muestra mltiples fichas que pueden contener imgenes u otros
controles.
TableLayoutPanel (Control, formularios Windows Forms)
Representa un panel que dispone dinmicamente su contenido en
una cuadrcula que se compone de filas y columnas.
TextBox (Control, formularios Windows Forms)
Permite que el usuario proporcione en varias lneas datos que se
puedan editar.
Timer (Componente, formularios Windows Forms)
Provoca un evento a intervalos regulares.
Barra de herramientas (Control, formularios Windows Forms)
Muestra mens y botones de mapa de bits que activan comandos.
Puede ampliar las funciones del control y modificar su apariencia y
comportamiento. Aunque el control ToolStrip reemplaza y agrega
funcionalidad al control ToolBar de las versiones anteriores,
ToolBar se conserva a efectos de compatibilidad con versiones
anteriores y uso futuro.
ToolStrip (Control de formularios Windows Forms)
Crea barras de herramientas y mens personalizados en las
aplicaciones de Windows Forms.
ToolStripContainer (Control)
Proporciona paneles a cada lado de un formulario para acoplar,
compartir espacio y organizar los controles ToolStrip y un panel
ToolStripContentPanel para los controles tradicionales.

ToolStripPanel (Control)
Proporciona un panel para acoplar, compartir espacio y organizar
controles ToolStrip.
Informacin general del control ToolStripProgressBar
Indica grficamente el progreso de una accin hacia su
finalizacin. ToolStripProgressBar est contenido normalmente en
StatusStrip.
ToolStripStatusLabel (Control)
Representa un panel de un control StatusStrip.
ToolTip (Componente, formularios Windows Forms)
Muestra texto cuando el usuario apunta a otros controles.
TrackBar (Control, formularios Windows Forms)
Permite la navegacin por un gran volumen de informacin o el
ajuste visual de una configuracin numrica.
TreeView (Control, formularios Windows Forms)
Muestra una jerarqua de nodos que se puede expandir o contraer.
WebBrowser (Control, Windows Forms)
Hospeda pginas Web y proporciona recursos de exploracin Web
de Internet a la aplicacin.

Crear y ejecutar una

instruccin SQL que
devuelva filas
Para ejecutar una instruccin SQL que devuelve filas, puede ejecutar una
consulta TableAdapter configurada para ejecutar una instruccin SQL
(por ejemplo, CustomersTableAdapter.Fill(CustomersDataTable)).

Si la aplicacin no utiliza TableAdapters, llame al mtodo ExecuteReader

en un objeto de comando, estableciendo su propiedad CommandType en
Text. El objeto "Command"" hace referencia al comando concreto para el
Proveedor de datos de .NET Framework que utiliza su aplicacin.
Ejemplo, si su aplicacin utiliza el proveedor de datos de .NET
Framework para el servidor SQL Server, el objeto de comando sera
SqlCommand.
Los ejemplos siguientes muestran cmo ejecutar instrucciones SQL que
devuelvan filas desde una base de datos utilizando TableAdapters u
objetos de comando. Para obtener ms informacin sobre cmo realizar
consultas con TableAdapters y comandos, vea Rellenar los conjuntos de
datos con datos.
Ejecucin de instrucciones SQL que devuelven filas mediante un
TableAdapter
Este ejemplo muestra cmo crear una consulta de TableAdapter
mediante Asistente para la configuracin de consultas de TableAdapter y,
a continuacin, proporciona informacin acerca de cmo declarar una
instancia de TableAdapter y ejecutar la consulta.
Para crear una instruccin SQL que devuelve filas mediante un
TableAdapter
1. Abra un conjunto de datos en el Diseador de Dataset.Para
obtener ms informacin, vea Cmo: Abrir un objeto Dataset en el
Diseador de Dataset.
2. Si no tiene uno ya, cree un TableAdapter.Para obtener ms
informacin sobre cmo crear TableAdapters, vea Cmo: Crear
TableAdapters.
3. Si ya tiene una consulta en su TableAdapter que utiliza una
instruccin SQL para devolver filas, pase al procedimiento

siguiente, "Para declarar una instancia del TableAdapter y ejecutar

la consulta". De lo contrario, contine con el paso 4 para crear una
nueva consulta que devuelva filas.
4. Haga clic con el botn secundario del mouse en el TableAdapter
deseado y utilice el men contextual para agregar una consulta.
El Asistente para la configuracin de consultas de TableAdapter se
abre.
5. Deje el valor predeterminado de Usar instrucciones SQL y, a
continuacin, haga clic en Siguiente.
6. Deje el valor predeterminado de SELECT que devuelve filas y, a
continuacin, haga clic en Siguiente.
7. Escriba su instruccin SQL o utilice el Generador de consultas
para que le ayude a crear una y, a continuacin, haga clic en
Siguiente.
8. Proporcione un nombre para la consulta.
9. Finalice el asistente; la consulta se agrega al TableAdapter.
10. Compilar el proyecto.
Para declarar una instancia de TableAdapter y ejecutar la consulta
1. Declare una instancia de TableAdapter que contenga la consulta
que desea ejecutar.
o

Para crear una instancia mediante las herramientas en

tiempo de diseo, arrastre el TableAdapter que desee
desde el Cuadro de herramientas. (Los componentes del
proyecto aparecen ahora en el Cuadro de herramientas
debajo de un encabezado que coincide con el nombre del

proyecto.) Si el TableAdapter no aparece en el Cuadro de

herramientas, quiz deba compilar el proyecto.
o

Para crear una instancia de cdigo, reemplace el cdigo

siguiente con los nombres de DataSet y TableAdapter. Dim
tableAdapter As New DataSetTableAdapters.TableAdapter

2. Llame a su consulta como llamara a cualquier otro mtodo del

cdigo.Su consulta es un mtodo de TableAdapter.Reemplace el
cdigo siguiente con los nombres de su TableAdapter y realice la
consulta.Tambin necesita pasar todos los parmetros requeridos
por la consulta.Si no est seguro de si su consulta requiere
parmetros,

de

IntelliSense

para

qu

parmetros

averiguar

la

requiere,

firma

compruebe

necesaria

de

la

consulta.Dependiendo de si la consulta toma o no parmetros, el

cdigo sera similar a:
TableAdapter.Query()
TableAdapter.Query(Parameters)
TableAdapter.Query(DataTable, Parameters)
3. El cdigo completo para declarar una instancia de TableAdapter y
ejecutar la consulta debe parecerse al siguiente:
NorthwindDataSetTableAdapters.CustomersTableAdaptertableAda
pter =
newNorthwindDataSetTableAdapters.CustomersTableAdapter();
tableAdapter.FillByCity(northwindDataSet.Customers, "Seattle");

Ejecucin de instrucciones SQL que devuelven filas mediante un

objeto de comando
El ejemplo siguiente muestra cmo crear un comando y ejecutar una
instruccin SQL que devuelve filas. Para obtener informacin sobre cmo
configurar y obtener los valores de parmetro para un comando, vea
Cmo: Establecer y obtener parmetros para objetos de comandos.
Este ejemplo utiliza el objeto SqlCommand y requiere:

Referencias a los espacios de nombres System, System.Data,

System.Data.SqlClient y System.Xml.

Un conjunto de datos denominado sqlConnection1.

Una tabla denominada Customers en el origen de datos al que se

conecta sqlConnection1. (De lo contrario, necesita una instruccin
SQL vlida para su origen de datos.)

Para ejecutar una instruccin SQL que devuelve filas mediante

programacin a travs de un objeto de comando

Agregue el cdigo siguiente a un mtodo desde el que desee

ejecutar el cdigo. Para devolver las filas llame al mtodo
ExecuteReader del comando (por ejemplo, ExecuteReader). Los
datos se devuelven en un objeto SqlDataReader. SqlConnection
sqlConnection1 = new SqlConnection("Your Connection String");
SqlCommandcmd = new SqlCommand();
SqlDataReader reader;
cmd.CommandText = "SELECT * FROM Customers";
cmd.CommandType = CommandType.Text;
cmd.Connection = sqlConnection1;
sqlConnection1.Open();
reader = cmd.ExecuteReader();

// Data is accessible through the DataReader object here.

sqlConnection1.Close();

Controles de validacin
Hay seis controles Web para la validacin de datos de entrada que se
pueden incorporar en un Formulario Web.
RequiredFieldValidator: Facilita la validacin de un dato del
formulario chequeando que el mismo tenga algn valor.
RangeValidator: Facilita la validacin de un dato del formulario
contra un valor mnimo y mximo.
CompareValidator: Facilita la validacin de un dato del formulario
contra un valor fijo u otro campo del formulario.
CustomValidator: Facilita la validacin de un dato del formulario
usando una subrutina propia.
RegularExpressionValidator: Facilita la validacin de un dato del
formulario contra una expresin.
ValidationSumary: Agrupa los mensajes de error de otros
controles en una parte de la pgina.
Todos los controles de validacin tienen tres propiedades fundamentales:
ControlToValidate, Text e IsValid. Todos los controles derivan de la clase
BaseValidator.
La propiedad ControlToValidate contiene la referencia del control del
formulario que queremos validar.

La propiedad Text almacena el mensaje de error que queremos que se

muestre en la pgina.
Por ltimo la propiedad IsValid almacena True en caso que el control
pase el test de validacin.
VAMOS A CREAR UN SITIO WEB FACIL
Crearemos un sitio web y lo llamaremos "ejercicio016". Luego
agregaremos seis WebForm con los siguientes nombres:
Default.aspx
Default2.aspx
Default3.aspx
Default4.aspx
Default5.aspx
Default6.aspx
Otra cosa que necesitamos hacer con ASP.Net 4.5 en adelante si no
utilizamos JQuery es hacer la siguiente configuracin en el archivo
Web.config:
<?xmlversion="1.0" encoding="utf-8"?>
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.5.2" />
<httpRuntimetargetFramework="4.5.2" />
</system.web>
<appSettings>
<add

key="ValidationSettings:UnobtrusiveValidationMode"

value="None" />
</appSettings>
</configuration>
Hemos agregado el elemento appSettings y dentro de ello hemos
configurado la clave UnobtrusiveValidationMode con el valor "None".
Si no hacemos esto no funcionaran las validaciones que implementemos.

CONTROLES DE VALIDACIN
Control: RequiredFieldValidator
Para probar este control haremos una pgina que solicite el nombre de
usuario (mostraremos un error si el operador no ingresa texto en el
TextBox)
La interface visual es la siguiente:

El mensaje en debe aparecer si presionamos el botn ?Confirmar? y no

se ingres texto en el TextBox.
En el Visual Studio .Net confeccionamos el formulario web disponiendo
uno control de tipo TextBox, un Button y un RequiredFieldValidator que
se encuentra en la pestaa ?Validacin? del ?Cuadro de herramientas?.
El control RequiredFieldValidator es importante inicializar las siguientes
propiedades:
Cuando ejecutemos la pgina podemos ver el cdigo que llega al
navegador

(en

ella

veremos

las

funciones

en

JavaScript

automticamente el ASP.NET nos crea para facilitar la validacin)

que

Si queremos que al presionar el

botn se redireccione a la pgina
Default2.aspx en caso de haber
ingresado un nombre de usuario
debemos codificar el mtodo click
para dicho botn:
using System;
usingSystem.Collections.Generic;
usingSystem.Linq;
usingSystem.Web;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
public

partial

class

_Default

System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
if (IsValid)
Response.Redirect("Default2.aspx");
}
}
La propiedad IsValid del WebForm almacena true si todos los controles
de validacin dispuestos en el formulario se validan correctamente. Es
decir en este problemas si se ingresa algn carcter en el control
TextBox luego se puede pasar a la pgina ?Default2.aspx?.

Control: RangeValidator
El control RangeValidator especifica un valor mnimo y mximo para un
control TextBox. Podemos utilizar el control para chequear el rango de
enteros, fechas, cadenas o valores reales.
Las propiedades ms importantes del control son:
ControlToValidate El campo del formulario a validar.
MinimumValue El valor mnimo a validar en el rango de valores.
MaximumValue El valor mximo a validar en el rango de valores.
Text El mensaje de error a mostrar.
Type El tipo de comparacin a ejecutar (valores posibles: String,
Integer, Double, Date, Currency)
Para probar este control haremos una pgina que solicite ingresar la
edad de una persona que se postula para un trabajo (la misma debe
estar en el rango de 18 a 35 aos)
Disponemos sobre el formulario los siguientes objetos: Label, TextBox,
Button y un RangeValidator.
La

interfaz

que

debemos

implementar es la siguiente:
El objeto RangeValidator lo
debemos configurar con los
siguientes valores:
Si ejecutamos la pgina veremos que el mensaje aparece si ingresamos
una edad que est fuera del rango de 18 a 35 aos.

El cdigo a implementar al presionar el

botn confirmar es el siguiente:
using System;
usingSystem.Collections.Generic;
usingSystem.Linq;
usingSystem.Web;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
public

partial

class

Default2

System.Web.UI.Page
{
protected void Page_Load(object sender,
EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
if (IsValid)
{
Response.Redirect("Default3.aspx");
}
}
}
Es decir redireccionamos a la prxima pgina en caso que todos los
controles de validacin del formulario se verifiquen correctos (en este
problema solo tenemos un control de tipo RangeValidator, pero en
muchos casos veremos que en un formulario puede haber ms de un
control de validacin)

Si quisiramos solo validar un control determinado del WebForm la

condicin sera:
if (RangeValidator1.IsValid)
{
Response.Redirect("Default3.aspx");
}
Es decir verificamos la propiedad IsValid del control RangeValidator (si
tenemos un solo control en el formulario preguntar por la propiedad
IsValid del webform o del RangeValidator el resultado ser idntico)
Control: CompareValidator
El control CompareValidator permite comparar un valor de un control con
otro control o comparar el valor de un control con un valor fijo.
Las propiedades ms importantes son:
ControlToValidate El campo del formulario a validar.
ControlToCompare El campo del formulario contra el cual se efecta la
comparacin.
Operator El operador a utilizarse en la comparacin (los valores
posibles son Equal, NotEqual, GreaterThan, GreaterThanEqual,
LessThan, LessThanEqual y DataTypeCheck)
Text El mensaje de error a mostrar.
Type El tipo de comparacin a ejecutar (valores posibles String, Integer,
Double, Date, Currency)
ValueToCompare El valor fijo a comparar.
Para probar este control implementaremos una pgina que realizara el
alta de la tabla usuarios (debe permitir el ingreso del nombre de usuario y
su clave, esta ltima dos veces, con el objetivo de asegurarse que la
ingres

correctamente),

emplearemos

un

objeto

de

CompareValidator para validar el ingreso repetido de la clave.

la

clase

La interfaz visual de la pgina es:

Al

objeto

CompareValidator
configuramos
propiedades

le
las

de

la

siguiente manera:
Es importante inicializar
la

propiedad

ControlToValidate con el objeto TextBox que carga la segunda clave,

luego que el operador carga la clave se procede a validar si el texto
ingresado coincide en el TextBox que hemos inicializada la propiedad
ControlToCompare.
El cdigo a implementar al presionar el botn ?Confirmar?:
using System;

usingSystem.Collections.Generic;
usingSystem.Linq;
usingSystem.Web;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
public partial class Default3 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
if (IsValid)
{
Response.Redirect("Default4.aspx");
}
}
}
Control: CustomValidator
El control CustomValidator permite validar el campo de un formulario con
una funcin de validacin propia. Debemos asociar nuestro control
CustomValidator con un evento propio.
Para probar este control implementaremos una pgina que solicite el
ingreso de un nmero mltiplo de 5, en caso de ingresar un valor
incorrecto mostraremos un mensaje de error.
Primero configuramos las propiedades del objeto CustomValidator con:

Ahora

debemos

ServerValidate

codificar

que

el

evento

el

objeto

tiene

CustomValidator1, a esto lo hacemos desde

la ventana de cdigo y lo podemos generar
automticamente haciendo doble clic sobre
el control en la ventana de diseo:
using System;
usingSystem.Collections.Generic;
usingSystem.Linq;
usingSystem.Web;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
public partial class Default4 : System.Web.UI.Page
{
protected

void

Page_Load(object sender,
EventArgs e)
{
}
protected
CustomValidator1_ServerValidate(object
ServerValidateEventArgsargs)
{
int valor;
valor = int.Parse(TextBox1.Text);
if (valor % 5 == 0)
args.IsValid = true;
else
args.IsValid = false;

void
source,

}
}
El parmetro args tiene una propiedad fundamental llamada IsValid que
debemos asignarle el resultado de nuestra validacin. En nuestro
ejemplo almacenamos el nmero ingresado en la variable valor, luego
mediante el operador % (resto de una divisin) verificamos si es cero, en
caso afirmativo inicializamos la propiedad IsValid del objeto args con el
valor true, en caso contrario, es decir que el nmero ingresado no sea un
mltiplo de 5 almacenamos el valor false.
Cuando se presiona el botn confirmar tenemos:
protected void Button1_Click(object sender, EventArgs e)
{
if (IsValid)
{
Response.Redirect("Default5.aspx");
}
}
Control: RegularExpressionValidator
El control RegularExpressionValidator permite validar el valor de un
campo de un formulario con un patrn especfico, por ejemplo un cdigo
postal, un nmero telefnico, una direccin de mail, una URL etc.
El planteo de un RegularExpression es bastante compleja, pero el Visual
Studio .Net provee una serie de expresiones regulares preconfiguradas.
Para probar este control, haremos una pgina que solicite el ingreso de
un mail y mostraremos un error en caso que el usuario ingrese un mail
mal
La interfaz visual de la pgina es la siguiente:

formado.

Al

objeto

de

la

clase

RegularExpressionValidator le
configuramos las propiedades
con los siguientes valores:

Si ejecutamos el programa podremos ver que

al abandonar el foco del TextBox aparecer el mensaje de error en caso de
ingresar un mail incorrecto:

using System;
usingSystem.Collections.Generic;
usingSystem.Linq;
usingSystem.Web;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
public partial class Default5 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs
{

}
protected void Button1_Click(object sender, EventArgs e)
{
if (IsValid)
{
Response.Redirect("Default6.aspx");
}
}
}
Control: ValidationSummary
Cuando tenemos formularios con gran cantidad de controles puede llegar
a ser dificultoso ubicar los errores en la pgina. El Framework de .Net
trae otra clase llamada ValidationSummary que muestra todos los errores
de la pgina agrupados en una parte de pantalla. Para utilizar el control
ValidationSummary es necesario fijar el valor de la propiedad
ErrorMessage para cada control de validacin que tiene la pgina. Es
importante no confundir la propiedad Text que aparece en la misma
posicin donde la disponemos con la propiedad ErrorMesage que
contiene el mensaje de error que mostrar el control ValidationSummary.
La interfaz de la pgina es la siguiente:

Debemos

disponer

los

siguientes

objetos

sobre

el

formulario:

1 Button, 2 TextBox, 2 RequiredFieldValidator y un objeto de la clase

ValidationSummary.
La propiedad text de los objetos RequiredFieldValidator las inicializamos
con un (*) asterisco y las propiedades ErrorMessage con las cadenas:
Debe ingresar el nombre de usuario? y Debe ingresar la clave?
respectivamente. En cuanto al objeto de la clase ValidationSummary no
debemos hacer ninguna configuracin especfica, solo ubicarlo dentro de
la pgina.
Para el evento clic del botn codificamos:
using System;
usingSystem.Collections.Generic;
usingSystem.Linq;
usingSystem.Web;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
public partial class Default6 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
if (IsValid)
{
Response.Redirect("Default.aspx");
}
}
}

Si se ingresan los dos datos se redirecciona a la primer pgina.

Cuando ejecutamos la pgina si no ingresamos los valores en los
TextBox al presionar el botn aparecen los mensajes de error:

Formulario
HTML

Formulario
ASP.NET sustituye a las pginas interpretadas utilizadas en ASP por un
sistema basado en componentes integrados en la plataforma .NET. De
esta forma, podemos crear aplicaciones web utilizando los componentes
que vienen incluidos en la biblioteca de clases de la plataforma .NET o,
incluso, creando nuestros propios componentes. Lo usual es que estos
ltimos los implementemos a partir de los componentes existentes por
composicin;

esto

es, encapsulando conjuntos de componentes

existentes en un componente nuevo.

Al construir nuestras aplicaciones utilizando componentes, podemos
utilizar un entorno de programacin visual como el Visual Studio .NET.
Como consecuencia, al desarrollar aplicaciones web, no hemos de
prestar demasiada atencin al HTML de nuestras pginas ASP.NET,
salvo, claro est, cuando estemos implementando los distintos

componentes que utilizaremos para crear los controles de la interfaz de

usuario. En otras palabras, los componentes nos permiten crear nuestra
aplicacin centrndonos en su lgica. Los propios componentes se
encargarn de generar los fragmentos de HTML necesarios para
construir la interfaz web de la aplicacin.

EJECUCIN DE PGINAS ASP.NET

Los servidores HTTP pueden configurarse de tal forma que las peticiones
recibidas se traten de diferentes formas en funcin del tipo de recurso
solicitado. Bsicamente, esta decisin la realiza el servidor a partir de la
extensin del recurso al que intenta acceder el cliente. En el caso de las
pginas ASP convencionales, cuando el usuario intenta acceder a un
fichero con extensin .asp, el Internet Information Server delega en la
biblioteca asp.dll, que se encarga de interpretar la pgina ASP.
Ejecucin de pginas ASP.NET: Usando el Internet Information Server
como servidor HTTP, una DLL ISAPI se encarga de que podamos
aprovechar todos los recursos de la plataforma .NET en el desarrollo de
aplicaciones web.

Creacin de pginas ASP.NET

La biblioteca de clases .NET incluye un conjunto de clases que nos sern
de utilidad en la creacin de las pginas ASP.NET. Entre dichas clases se
encuentra una amplia gama de controles que podremos utilizar en la
construccin de interfaces web para nuestras aplicaciones, controles
tales como botones, cajas de texto, listas o tablas. Adems, la biblioteca
de clases estndar tambin proporciona algunos componentes que nos
facilitarn realizar tareas comunes como la gestin del estado de nuestra
aplicacin web. Conforme vayamos avanzando en la construccin de
pginas ASP.NET, iremos viendo cmo funciona cada uno de los
componentes suministrados por la plataforma .NET.
Una aplicacin web, generalmente, estar formada por varios formularios

web. Cada uno de esos formularios lo implementaremos como unas

pginas ASP.NET. En la plataforma .NET, las pginas ASP.NET se
construyen creando clases derivadas de la clase System.Web.UI.Page.
Dicha clase proporciona la base sobre la que construiremos nuestras
pginas

ASP.NET,

que

implementaremos

como

subclases

de

System.Web.UI.Page en las que incluiremos la funcionalidad requerida

por nuestras aplicaciones.

<% @Page Language="C#" Inherits="TodayPage" Src="Today.cs" %>

<html>
<body>
<h1 align="center">
Hoy es <% OutputDay(); %>

El fichero anterior incluye todo lo necesario para generar dinmicamente

una pgina web en la que incluiremos la fecha actual, que aparecer
donde est el fragmento de cdigo delimitado por <% y %>, las mismas
etiquetas que se utilizan en ASP tradicional para combinar la parte
esttica de la pgina (las etiquetas HTML) con la parte que ha de
generarse dinmicamente. En esta ocasin, en vez de introducir el
cdigo necesario entre las etiquetas <% y %>, hemos optado por
implementar una funcin auxiliar OutputDay que definiremos en un
fichero de cdigo aparte. El aspecto de este fichero de cdigo, con
extensin .cs, ser el siguiente:

using System;
using System.Web.UI;
public class TodayPage:Page
{
protected void OutputDay()

Este fichero define una clase (TodayPage) que hereda de la clase

System.Web.UI.Page. En nuestra clase hemos incluido un mtodo que
se encargar de generar un mensaje en el que se muestre la fecha
actual. Para ello empleamos la clase Response que representa la

respuesta de nuestra pgina ASP.NET y la clase DateTime que forma

parte del vasto conjunto de clases incluidas en la biblioteca de
clases de la plataforma.
Uso de controles en ASP.NET
Utilizando ASP.NET, las interfaces web se construyen utilizando controles
predefinidos. Estos controles proporcionan un modelo orientado a objetos
de los formularios web, similar en cierto modo al definido por JavaScript.
Sin embargo, a diferencia de JavaScript, en ASP.NET no trabajaremos
directamente sobre los objetos que representan las etiquetas HTML del
documento que visualiza el usuario en su navegador. Lo que haremos
ser utilizar controles definidos en la biblioteca de clases .NET.
Al emplear controles predefinidos en nuestra interfaz de usuario en vez
de especificar directamente las etiquetas HTML de los formularios web,
las pginas ASP.NET se convierten en meras colecciones de controles.
Desde el punto de vista del programador, cada control ser un objeto
miembro de la clase que representa la pgina (aqulla que hereda de
System.Web.UI.Page). Cuando deseemos asociar a nuestra pgina un
comportamiento dinmico, lo nico que tendremos que hacer es asociar
a los distintos controles los manejadores de eventos que se encargarn
de implementar la funcionalidad de la pgina, exactamente igual que
cuando se crea una interfaz grfica para Windows utilizando un entorno
de programacin visual. Adems, en nuestras pginas ASP.NET
podremos incluir nuestros propios controles, los cuales crearemos a
partir de los controles existentes por derivacin (creando clases nuevas
que

hereden

de

las

clases

ya

definidas)

por

composicin

(encapsulando una pgina completa para luego utilizarla como un control

ms dentro de otras pginas).
En definitiva, en vez de utilizar un intrprete que se encargue de ejecutar
los fragmentos de cdigo desperdigados por nuestras pginas web, lo
que haremos ser utilizar un sistema basado en eventos para generar
dinmicamente el contenido de las pginas que se le muestran al

usuario. Esto nos permitir acceder a todas las caractersticas de C#

y de la plataforma .NET para construir aplicaciones web flexibles,
modulares y fciles de mantener.
Adems, aparte de proporcionar un modelo orientado a objetos de la
aplicacin que evita el cdigo "spaghetti" tpico de ASP, los controles web
constituyen una capa intermedia entre el cdigo de la aplicacin y la
interfaz de usuario. Entre las ventajas que proporciona este hecho,
destaca la compatibilidad automtica de las aplicaciones web con
distintos tipos de navegadores. La implementacin de los distintos
controles se encargar de aprovechar la funcionalidad de los
navegadores modernos (como JavaScript o HTML dinmico), sin que
esto suponga que nuestra aplicacin deje de funcionar en navegadores
ms antiguos (los que se limitan a soportar HTML 3.2). Dentro de las
pginas ASP.NET, los controles se indican en el fichero .aspx utilizando
etiquetas de la forma <asp:... />. Para implementar el ejemplo de la
seccin anterior utilizando controles, lo nico que tenemos que hacer es
crear una pgina ASP.NET con una etiqueta (componente asp:Label).
Si estamos utilizando Visual Studio .NET como entorno de desarrollo,
creamos un nuevo proyecto de tipo Aplicacin Web ASP.NET. Al
aparecernos un formulario web vaco, modificamos su propiedad
pageLayout para utilizar el estilo FlowLayout tpico de las pginas web,
en las que los controles no se colocan en coordenadas fijas (a diferencia
de la forma habitual de trabajar con formularios Windows).
Para que el contenido de la pgina aparezca centrado, utilizamos uno de
los botones de la barra de herramientas igual que si estuvisemos
trabajando con un procesador de textos. Finalmente, aadimos una
etiqueta [Label] que obtenemos del cajn Web Forms del cuadro de
herramientas. Una vez que tenemos el control en nuestro formulario web,
lo normal es que modifiquemos su identificador (propiedad (ID)) y el texto
que muestra en el formulario (propiedad Text).
Como resultado de este proceso obtenemos el siguiente fichero .aspx, en

el que aparece nuestro control como una etiqueta asp:Label:

El fichero mostrado define los controles existentes en nuestra interfaz de
usuario e incluye informacin adicional acerca de cmo ha de procesarse
la pgina ASP.NET. De todo lo que ha generado el Visual Studio, el
detalle ms significativo es la inclusin del atributo runat="server" en
todos aquellos componentes de nuestra interfaz a los que podemos
asociarles manejadores de eventos que implementen la lgica de la
aplicacin como respuesta a las acciones del usuario. Dichos
manejadores de eventos se ejecutarn siempre en el servidor y sern los
encargados de que nuestras aplicaciones sean algo ms que pginas
estticas en las que se muestra informacin.

<%@ Page language="c#"

Codebehind="WebControlExample.aspx.c
s" AutoEventWireup="false"
Inherits="WebControlExample.WebForm"
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
</HEAD>
<body>
<form id="Form1" method="post" runat="server">
<P align="center">
<asp:Label id="LabelFecha" runat="server">Hoy
es...</asp:Label>
</P>
</form>
</body>
</HTML>

El evento Page_Load nos permite especificar acciones que deseamos

realizar antes de mostrarle la pgina al usuario.
Implementamos la lgica de la aplicacin como respuesta al evento
dentro del fichero de cdigo C# asociado a la pgina ASP.NET. En el
ejemplo que nos ocupa slo tenemos que escribir una lnea de cdigo
dentro del mtodo creado automticamente por el Visual Studio .NET
para gestionar el evento Page_Load:

private void Page_Load(object sender, System.EventArgs e)

{
LabelFecha.Text = "Hoy es " + DateTime.Now.ToString("D");

En realidad, el cdigo de nuestra aplicacin es algo ms complejo.

Aunque nosotros slo nos preocupemos de escribir el cdigo que
muestra la fecha actual, el entorno de desarrollo se encarga de hacer el
resto del trabajo por nosotros. El cdigo completo asociado a nuestro
formulario, eliminando comentarios y sentencias using, ser el mostrado
a continuacin:

public class WebForm : System.Web.UI.Page

{
protected System.Web.UI.WebControls.Label LabelFecha;
private void Page_Load(object sender, System.EventArgs e)
{
LabelFecha.Text = "Hoy es " + DateTime.Now.ToString("D");
}
#region Cdigo generado por el Diseador de Web
Forms override protected void OnInit(EventArgs e)
{
InitializeComponen
t();
base.OnInit(e);
}
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}

La regin de cdigo que no hemos implementado nosotros se encarga,

bsicamente, de inicializar los componentes de nuestra pgina con las
propiedades que fijamos en el diseador de formularios (aqullas que
aparecen en el fichero .aspx) y, adems, les asigna los manejadores de
eventos que hemos implementado a los distintos eventos asociados a los
componentes de nuestra interfaz; esto es, enlaza nuestro cdigo con los
componentes de la interfaz. En el ejemplo mostrado, el nico evento para
el cual nuestra aplicacin tiene una respuesta especfica es el evento
Load del formulario web.
El ejemplo anterior puede conducir a conclusiones errneas si no se

analiza con detalle. Puede parecer que el formulario web construido

utilizando controles resulta excesivamente complejo en comparacin con
la implementacin equivalente que vimos en la seccin anterior de este
captulo. No obstante, la organizacin modular de la pgina ASP.NET
simplifica

el

desarrollo

de

interfaces complejos y su

posterior

mantenimiento. Resulta mucho ms sencillo modificar el cdigo incluido

en un mtodo de una clase que el cdigo disperso entre etiquetas
propias de la interfaz de usuario. Adems, la comprobacin del correcto
funcionamiento del cdigo implementado tambin ser ms sencilla
cuando slo incluimos en el fichero .aspx los controles de la interfaz de
usuario e implementamos su funcionalidad aparte. Por otra parte, la
complejidad extra que supone utilizar los controles no repercute en el
trabajo del programador, ya que el entorno de desarrollo se encarga de
generar automticamente el cdigo necesario para enlazar los controles
con el cdigo implementado por el programador.
Al usar controles en nuestra interfaz web, la lgica de la aplicacin se
implementa como respuesta de la interfaz de usuario a los distintos
eventos que puedan producirse, exactamente igual que en cualquier
entorno de programacin visual para Windows. El servidor web ser el
encargado de interpretar las etiquetas correspondientes a los controles
ASP.NET y visualizarlos correctamente en el navegador del usuario, para
lo cual tendr que generar el cdigo HTML que resulte ms apropiado.
Una vez que hemos visto el funcionamiento de los controles en las
pginas ASP.NET, podemos pasar a analizar los distintos tipos de
controles que podemos incluir en nuestras pginas web. En la plataforma
.NET, existen tres tipos de controles predefinidos que se pueden utilizar
en las pginas ASP.NET:
- Los

controles

HTML

representan

etiquetas

HTML

tradicionales y funcionan de forma similar a los objetos

utilizados en JavaScript para manipular dinmicamente el

contenido de una pgina web.

- Los controles web son los controles asociados a las etiquetas

especficas de ASP.NET y facilitan el desarrollo de interfaces
web utilizando un entorno de programacin visual como
Visual Studio .NET.

- Por ltimo, existe una serie de controles de validacin que se

emplean para validar las entradas introducidas por el usuario
de una forma relativamente cmoda (aunque no siempre
resulta la ms adecuada desde el punto de vista del diseo
de la interfaz de usuario).

Aparte de estos controles, que ya vienen preparados para su utilizacin,

el programador puede crear sus propios controles para simplificar la
creacin de interfaces consistentes y evitar la duplicacin innecesaria de
cdigo en distintas partes de una aplicacin web.
En los siguientes apartados de esta seccin analizaremos con algo ms
de detalle los distintos tipos de controles que se pueden utilizar en las
pginas ASP.NET y veremos cmo podemos crear nuestros propios
controles fcilmente.
Controles HTML
Por defecto, las etiquetas HTML incluidas en una pgina ASP.NET se
tratan como texto en el servidor web y se envan tal cual al cliente. No
obstante, en determinadas ocasiones puede que nos interese manipular
su contenido desde nuestra aplicacin, que se ejecuta en el servidor.
Para que las etiquetas HTML sean programables en el servidor, slo
tenemos que aadirles el atributo runat="server".
En el siguiente ejemplo veremos cmo podemos hacer que un enlace

HTML apunte dinmicamente a la URL que nos convenga en cada

momento. En HTML, los enlaces se marcan con la etiqueta <A>. Para
poder modificar las propiedades del enlace en HTML, slo tenemos que
aadir el atributo runat="server" a la etiqueta estndar <A> y asociarle al
enlace un identificador adecuado. El fichero .aspx de nuestra pgina
ASP.NET quedara como se muestra a continuacin:
<html>
...
<body>
<form id="HTMLControl" method="post" runat="server">
<a id="enlace" runat="server">Visite nuestra pgina!</a>

Una vez que hemos marcado el enlace con el atributo runat="server",

podemos modificar sus propiedades accediendo a l a travs del
identificador que le hayamos asociado. En ASP.NET, los enlaces HTML
de una pgina se representan mediante el control HtmlAnchor. Una de
las propiedades de este control (HRef) indica la URL a la que apunta el
enlace, por lo que slo tenemos que establecer un valor adecuado para
esta propiedad en el cdigo asociado a alguno de los eventos de la
public class HTMLControl : System.Web.UI.Page
{
protected System.Web.UI.HtmlControls.HtmlAnchor enlace;
private void Page_Load(object sender, System.EventArgs e)
{
enlace.HRef = "http://csharp.ikor.org/";
}
override protected void OnInit(EventArgs e)
{
this.Load += new
System.EventHandler(this.Page_Load);
base.OnInit(e);
}
}

pgina ASP.NET. El fichero de cdigo resultante tendra el siguiente

aspecto:
Si utilizamos Visual Studio .NET, para poder manipular un control HTML
en el servidor slo tenemos que seleccionar la opcin "Ejecutar como
control del servidor" del men contextual asociado a la etiqueta HTML en
el diseador de formularios web. Esto hace que se aada al atributo
runat="server" a la etiqueta en el fichero .aspx y que se incluya la
declaracin correspondiente en la clase que define nuestro formulario,
con lo cual ya podemos programar el comportamiento del control HTML
en funcin de nuestras necesidades accediendo a l como un miembro
ms de la clase que representa la pgina ASP.NET.

La biblioteca de clases de la plataforma .NET incluye una gama bastante

completa de componentes que encapsulan las distintas etiquetas que
pueden aparecer en un documento HTML. Dichos componentes se
encuentra en el espacio de nombres System.Web.UI.HtmlControls.
Las etiquetas ms comunes en HTML tienen su control HTML
equivalente en ASP.NET. Este es el caso de los enlaces o las imgenes
en HTML, los cuales se representan como objetos de tipo HtmlAnchor y
HtmlImage en las pginas ASP.NET, respectivamente. Si, por cualquier
motivo, nos encontramos con que no existe un control HTML especfico
para representar una etiqueta HTML determinada, esto no impide que
podamos manipularla desde nuestra aplicacin web. Existe un control
genrico, denominado HtmlGenericControl.
La siguiente tabla resume los controles HTML disponibles en ASP.NET,
las etiquetas a las que corresponden en HTML estndar y una breve
descripcin de su funcin en la creacin de pginas web:

Control HTML

Etiqueta HTML

Descripcin

HtmlAnchor

<a>

Enlace

HtmlButton

<button>

Botn

HtmlForm

<form>

Formulario

HtmlGenericContro
l

Cualquier elemento
HTML para el cual no
existe un control HTML
especfico

HtmlImage

HtmlInput...

<image>

<input type="...">

Imagen

Distintos tipos de

entradas
En un formulario HTML:
botones (button, submit
y reset), texto (text y
password), opciones
(checkbox y radio),
imgenes (image),
ficheros (file) y entradas
ocultas (hidden).

HtmlSelect

<select>

Lista de opciones en un
formulario

HtmlTable...

<table> <tr> <td>

Tablas, filas y celdas

HtmlTextArea

<textarea>

Texto en un formulario

CONTROLES WEB
La principal aportacin de ASP.NET a la creacin de interfaces web es la
inclusin de controles especficos que aslan al programador del HTML

generado para presentar el formulario al usuario de la aplicacin. Como

ya mencionamos anteriormente, estos controles permiten desarrollar
aplicaciones web compatibles con distintos navegadores y facilitan la
tarea del programador al ofrecerle un modelo de programacin basado
en eventos.
En el fichero .aspx asociado a una pgina ASP.NET, los controles web se
incluyen utilizando etiquetas especficas de la forma <asp:... />. La
sintaxis general de una etiqueta ASP.NET es de la siguiente forma:

<asp:control id="identificador" runat="server" />

Dada una etiqueta como la anterior:

- control variar en funcin del tipo de control que el programador
decida incluir en su pgina ASP.NET. La etiqueta concreta de la
forma asp:... /> ser diferente para mostrar un texto (asp:Label),
un botn (asp:Button), una lista convencional (asp:ListBox) o una
lista desplegable (asp:DropDownList), por mencionar algunos
ejemplos.
- identificador especifica el identificador que le asociamos a la
variable mediante la cual accederemos al control desde el cdigo
de nuestra aplicacin.
- Finalmente, la inclusin del atributo runat="server" es necesaria
para indicar que el programador puede manipular la etiqueta
ASP.NET desde el servidor implementando manejadores de
eventos para los distintos eventos a los que pueda responder el
control representado por la etiqueta ASP.NET.

Igual que suceda con las etiquetas HTML, en la biblioteca de clases de

la plataforma .NET existen componentes que nos permiten manipular

dichas las etiquetas ASP.NET desde el cdigo de la aplicacin. Dichos
componentes encapsulan a las distintas etiquetas ASP.NET y se
encuentran en el espacio de nombres System.Web.UI.WebControls. De
hecho, todos ellos derivan de la clase WebControl, que se encuentra en
el mismo espacio de nombres.

Uso de controles ASP.NET

<form id="WebControl" method="post" runat="server">
<asp:Button id="Button" runat="server" Text="Pulse el
botn">
</asp:Button>
</form>
As mismo, en el fichero de cdigo asociado a la pgina aparece una
declaracin de la forma:

protected System.Web.UI.WebControls.Button Button;

Ahora slo nos falta aadirle algo de funcionalidad a nuestra aplicacin.
Para lograrlo, buscamos los eventos a los cuales ha de reaccionar
nuestro formulario web e implementamos los manejadores de eventos
correspondientes. Por ejemplo, desde el mismo diseador de formularios
web del Visual Studio .NET, podemos hacer doble click sobre el botn
para especificar la respuesta de este control al evento que se produce
cuando el usuario pulsa el botn desde su navegador web:
private void Button_Click(object sender, System.EventArgs e)
{
Button.Text = "Ha pulsado el botn";

}
Como se puede comprobar, el desarrollo de aplicaciones web con
controles ASP.NET es completamente anlogo al desarrollo de
aplicaciones para Windows. Slo tenemos que seleccionar los controles
adecuados para nuestra interfaz e implementar la respuesta de nuestra
aplicacin a los eventos que deseemos controlar.
Aunque la forma de desarrollar la interfaz de usuario sea la misma
cuando se utilizan formularios web ASP.NET y cuando se emplean
formularios para Windows, los controles que se pueden incluir cambian
en funcin del tipo de interfaz que deseemos crear. En el caso de los
formularios web, podemos utilizar cualquiera de los controles definidos
en el espacio de nombres System.Web.UI.WebControls de la biblioteca
de clases de la plataforma.NET. La mayora de ellos corresponden a
los controles tpicos que uno podra esperar encontrarse en cualquier
interfaz grfica actual, si bien tambin existen otros muy tiles para el
programador en la creacin de interfaces ms sofisticadas (como es el
caso

de

los

componentes

asp:Repeater

asp:DataGrid,

que

mencionaremos ms adelante en este mismo captulo).

La tabla que ofrecemos a continuacin resume, a modo de gua, cules
son los controles ASP.NET y menciona su funcin en la creacin de
interfaces web con ASP.NET:

Control

Descripcin

AdRotator

Muestra una secuencia de imgenes (a modo de

Button

banner)
Botn
estndar

Calendar

Calendario mensual

CheckBox

Caja de comprobacin (como en los formularios

CheckBoxList

Windows)
Grupo de cajas
de comprobacin

DataGrid

Rejilla de datos

DataList

Muestra una lista utilizando plantillas (templates)

DropDownList

Lista desplegable

HyperLink

Enlace

Image

Imagen

ImageButton

Botn dibujado con una imagen

Label

Etiqueta de texto esttico

LinkButton

Botn con forma de enlace

ListBox

Lista (como en los formularios Windows)

Literal

Texto esttico (similar a Label)

Panel

Contenedor en el que se pueden colocar otros

PlaceHolder

Reserva espaciocontroles
para controles aadidos

RadioButton

dinmicamente
Botn de radio (como
en los formularios Windows)

RadioButtonList

Grupo de botones de radio

Repeater

Permite mostrar listas de controles

Table

Tabla

TextBox

Caja de edicin

Xml

Muestra un fichero XML o el resultado de una

transformacin XSL

Como se puede apreciar a partir de la lista de controles de la tabla, la

gama de controles estndar ya disponibles es bastante amplia, lo
suficiente como para poder construir interfaces grficos estndar sin
tener que preocuparnos demasiado de los detalles de implementacin de
los controles de la interfaz de usuario.

CONTROLES DE VALIDACIN
Para finalizar nuestro recorrido por los componentes predefinidos en la
biblioteca de clases de la plataforma .NET para la creacin de interfaces
web, mostraremos un tercer grupo de componentes que puede utilizarse
para imponer ciertas restricciones a los datos introducidos por el usuario:

los controles de validacin.

Los controles de validacin son un tipo especial de controles ASP.NET,
por lo que tambin estn incluidos en el espacio de nombres
System.Web.UI.WebControls. Estos controles se enlazan a controles
ASP.NET de los descritos en el apartado anterior para validar las
entradas de un formulario web. Cuando el usuario rellena los datos de un
formulario y alguno de los datos introducidos no verifica la restriccin
impuesta por el control de validacin, este control se encarga de
mostrarle un mensaje de error al usuario.
La validacin de las entradas de un formulario web se realiza
automticamente cuando se pulsa un botn, ya tenga ste la forma de un
botn estndar (Button), de una imagen (ImageButton) o de un enlace
(LinkButton). No obstante, se puede desactivar esta validacin si
establecemos

false

la

propiedad

CausesValidation

del

botn

correspondiente. Igualmente, se puede forzar la validacin manualmente

en el momento que nos interese mediante el mtodo Validate asociado a
la pgina ASP.NET.

Cuando los datos introducidos por el usuario son vlidos, la aplicacin

prosigue su ejecucin de la forma habitual. Cuando no se verifica alguna
condicin de validacin, se muestra el mensaje de error asociado al
control de validacin y se le vuelve a pedir al usuario que introduzca
correctamente los datos de entrada. Obviamente, la validacin la
podramos haber realizado implementando la respuesta de nuestra
aplicacin a los eventos asociados utilizando controles web estndar,

Para ver cmo funcionan los controles de validacin, podemos crear una aplicacin web
ASP.NET con un formulario como el mostrado en la imagen de arriba, en el cual incluimos una etiqu
Para que nuestro formulario web utilice el control de validacin, slo tenemos que establecer

aunque

de

esta

forma,

ASP.NET

se

encargar

de

generar

automticamente las rutinas de validacin y automatizar, al menos en

parte, algunas de las comprobaciones ms comunes que se realizan al
leer datos de entrada en cualquier aplicacin.
Los controles de validacin predefinidos en la biblioteca de clases de la
plataforma .NET se encuentran, como mencionamos al comienzo de esta
seccin, en el espacio de nombres System.Web.UI.WebControls. Todos
los

controles

de

validacin

derivan

de

la

clase

System.Web.UI.WebControls.BaseValidator. En la siguiente tabla se

recoge cules son y qu utilidad tienen:
Control de validacin
CompareValidator

Descripcin
Compara el valor de una entrada
con el de otra o un valor
fijo.

CustomValidator

Permite implementar un mtodo

cualquiera

que

maneje

la

validacin del valor introducido.

RangeValidator

Comprueba que la entrada est

entre

dos

valores

dados.
RegularExpressionValidator

Valida el valor de acuerdo a un

patrn

establecido

como

una

expresin regular.
RequiredFieldValidator

Hace que un valor de entrada

sea obligatorio.

CONTROLES CREADOS POR EL USUARIO

En las secciones anteriores de este captulo hemos visto cules son los
controles predefinidos que podemos utilizar en la creacin de interfaces
web con ASP.NET. En esta, veremos cmo podemos crear nuestros
propios controles.
En ASP.NET, el programador puede crear sus propios controles de dos
formas diferentes:
- Por composicin: A partir de una coleccin de controles ya
existentes, el programador decide cmo han de visualizarse
conjuntamente. En vez de tener que repetir la disposicin del
conjunto de controles cada vez que hayan de utilizarse en la
aplicacin, la coleccin de controles se encapsula en un
nico control. Cada vez que se desee, se puede aadir el
control a un formulario web para mostrar el conjunto completo
de controles a los que encapsula.

- Por derivacin: Igual que en cualquier otro entorno de

programacin

orientado

objetos,

los

controles

se

implementan como clases. Estas clases heredarn, directa o

indirectamente, de la clase base de todos los controles web:
la clase System.Web.UI.WebControl (la cual est definida en
la biblioteca System.Web.dll).

En esta seccin nos centraremos en la primera de las alternativas, la

creacin de controles de usuario por composicin, porque su uso es muy
habitual en la creacin de aplicaciones web en ASP.NET. Como veremos
en los prximos captulos del libro, los controles ASP.NET creados de
esta manera son los que nos permiten construir aplicaciones modulares
que sean fcilmente mantenibles y extensibles.
Dado que los controles definidos por composicin se utilizan como
bloque bsico en la construccin de aplicaciones web con ASP.NET, lo
usual es que dichos controles se adapten a las necesidades de cada
aplicacin particular. Esto, obviamente, no impide que podamos crear
controles reutilizables en distintas aplicaciones si hemos de realizar el
mismo tipo de tareas en diferentes proyectos de desarrollo.
Supongamos ahora que deseamos crear una aplicacin web en la cual
se almacene informacin de contacto relativa a diferentes personas,
como podra ser el caso de las entradas de una sencilla agenda, un
cliente de correo electrnico o una completa aplicacin de gestin en la
que tuvisemos que mantener informacin acerca de clientes o
proveedores. En cualquiera de las situaciones mencionadas, en nuestra
aplicacin existir una clase que encapsule los datos relativos a distintas
personas. La implementacin de dicha clase podra tener un aspecto
similar, aunque nunca igual, al que se muestra a continuacin:
public class Contact
{

public
public
public
public
public
public
public
public

string
string
string
string
string
string
string
string

Name;
EMail;
Telephone;
Mobile;
Fax;
Address;
Comments;
ImageURL;

//
//
//
//
//
//
//
//

Nombre
Correo electrnico
Telfono
Telfono mvil
Fax
Direccin
Anotaciones
URL de su fotografa

Por tanto, cada variable de instancia de las que antes habamos

declarado pblicas debera, al menos, convertirse en un fragmento de
cdigo como el siguiente:

...
private string _variable;
public string
Variable { get
{ return
_variable; }

Una vez que tenemos clases que encapsulan los datos con los que
nuestra aplicacin ha de trabajar, hemos de crear una interfaz de usuario
adecuada para que el usuario de nuestra aplicacin pueda trabajar con
los datos.
Clases como la anterior se denominan habitualmente clases modelo.
Este apelativo proviene del hecho de que estas clases son las que
modelan el dominio del problema que nuestra aplicacin pretende
resolver (la representacin de datos de contacto en nuestro ejemplo).
stas son las clases que suelen aparecer en un diagrama de clases UML
o en el modelo de datos de una base de datos.

Para construir la interfaz de usuario asociada a nuestra clase modelo, lo

que haremos ser crear vistas que nos permitan mostrar de distintas
formas los datos que encapsula la clase modelo. Por ejemplo, puede que
nos interese mostrar los datos de contacto de una persona en una tabla
como la siguiente:

Presentacin visual de los datos de contacto de una persona

La presentacin visual de los datos de contacto requiere la utilizacin de
distintos controles, como las etiquetas que nos permitirn mostrar los
datos concretos del contacto o la imagen que utilizaremos para visualizar
la fotografa de nuestro contacto. Si en nuestra aplicacin tuvisemos
que mostrar la informacin de contacto en diferentes situaciones,
resultara bastante tedioso tener que copiar la tabla anterior y repetir todo
el cdigo necesario para rellenarla con los datos particulares de una
persona. Aun pudiendo usar copiar y pegar, esta estrategia no resulta
demasiado razonable. Qu sucedera entonces si hemos de cambiar
algn detalle de la presentacin visual de los datos de contacto?
Tendramos que buscar todos los sitios de nuestra aplicacin en los que
aparezca una tabla como la anterior y realizar la misma modificacin en
diferentes lugares. Esto no solamente resulta incmodo, sino una
situacin as es bastante proclive a que, al final, cada vez que mostremos
los datos de una persona lo hagamos de una forma ligeramente diferente
y el comportamiento de nuestra aplicacin no sea todo lo homogneo
que debera ser. En otras palabras, olvidar la realizacin de las
modificaciones en alguna de las apariciones del fragmento duplicado
provoca errores. Adems, todos sabemos que la existencia de cdigo
duplicado influye negativamente en la mantenibilidad de nuestra
aplicacin y, a la larga, en su calidad.
Por suerte, ASP.NET incluye el mecanismo adecuado para evitar
situaciones como las descritas en el prrafo anterior: los controles de

usuario creados por composicin. Un conjunto de controles como el que

utilizamos para mostrar los datos de contacto de una persona se puede
encapsular en un nico control que despus emplearemos en la creacin
de nuestros formularios web. El mecanismo utilizado es anlogo a los
frames de Delphi o C++Builder.
Para encapsular un conjunto de controles en un nico control, lo nico
que tenemos que hacer es crear un "control de usuario Web", tal como
aparece traducido en Visual Studio .NET el trmino ingls web user
control, aunque quiz sera ms correcto decir "control web de usuario".
En realidad, un control de este tipo se parece ms a un formulario web
que a un control de los que existen en el "cuadro de herramientas" (la
discutible traduccin de toolbox en Visual Studio).
Un control web de usuario nos permite definir el aspecto visual conjunto
de una coleccin de controles a los que encapsula. El control es similar a
una

pgina

ASP.NET

salvo

que

hereda

de

la

clase

System.Web.UI.UserControl en vez de hacerlo de System.Web.UI.Page.

Por convencin, los controles web de usuario se almacenan en ficheros
con extensin .ascx (en lugar de la extensin .aspx de los formularios
ASP.NET). Dicho fichero ser el que se incluya luego dentro de una
pgina ASP.NET, por lo que en l no pueden figurar las etiquetas
<html>, <head>, <body>, <form> y <!DOCTYPE>, las cuales s
aparecen en un formulario ASP.NET.
Teniendo en cuenta lo anterior, podemos crear un control web de usuario
para mostrar los datos de contacto de una persona. Dicho control se
denominar ContactViewer porque nos permite visualizar los datos de
contacto pero no modificarlos y se crear de forma anloga a como se
crean los formularios ASP.NET.
En primer lugar, creamos un fichero con extensin .ascx que contenga
los controles de la interfaz de usuario que nuestro control ha de
encapsular. Dicho fichero se denominar ContactViewer.ascx y tendr el
siguiente aspecto:

<%@ Control Language="c#"

AutoEventWireup="false"
Codebehind="ContactViewer.ascx.cs"
Inherits="WebMail.ContactViewer"%>
<DIV align="center">
<TABLE id="TableContact" width="90%" border="0">
<TR>
<TD width="100" bgColor="#cccccc">
Nombre
</TD>
<TD bgColor="#e0e0e0">
<asp:Label id="LabelName" runat="server">
Nombre del contacto
</asp:Label>
</TD>
<TD vAlign="middle" align="center" width="20%" rowSpan="6">
<asp:Image id="ImagePhoto" runat="server" Height="200px">
</asp:Image>
</TD>
</TR>
<TR>
<TD bgColor="#cccccc">
E-mail
</TD>
<TD bgColor="#e0e0e0">
<asp:Label id="LabelEMail" runat="server">
mailbox@domain
</asp:Label>
</TD>
</TR>
<!-- Lo mismo para los dems datos del contacto -->
...
<TR>
<TD colSpan="3">
<P>
<asp:Label id="LabelComments" runat="server">
Comentarios
</asp:Label>
</P>
</TD>
</TR>
</TABLE>
</DIV>

Como se puede apreciar, su construccin es similar al de un formulario

ASP.NET. Slo cambia la directiva que aparece al comienzo del fichero.
En vez de utilizar la directiva <%@ Page... propia de los formularios
ASP.NET, se emplea la directiva <%@ Control. Especfica para la creacin
de controles por composicin. Aparte de eso y de la ausencia de algunas
etiquetas (<html>, <head>, <body>, <form> y <!DOCTYPE>), no existe
ninguna otra diferencia entre un fichero .ascx y un fichero .aspx.

Igual que suceda en las pginas ASP.NET, al crear un control

separaremos la lgica de la interfaz implementando el cdigo asociado al
control en un fichero de cdigo aparte. A este fichero hace referencia el
atributo Codebehind de la directiva <%@ Control que aparece al
comienzo del fichero .ascx. En el ejemplo que estamos utilizando, el
contenido del fichero de cdigo ContactViewer.ascx.cs ser el que se
muestra a continuacin:

public class ContactViewer : System.Web.UI.UserControl

{
// Controles de la interfaz de usuario
protected...
// Modelo asociado a la
vista public Contact
DisplayedContact {
set { UpdateUI(value); }
}
private void UpdateUI (Contact
contact) { if (contact!=null) {
LabelName.Text = contact.Name;
LabelEMail.Text = contact.EMail;
LabelTelephone.Text =
contact.Telephone;
LabelMobile.Text =
contact.Mobile; LabelFax.Text =
contact.Fax; LabelAddress.Text =
contact.Address;
LabelComments.Text =
contact.Comments;

ImagePhoto.ImageUrl = "contacts/"+contact.ImageURL;

// Cdigo generado por el diseador de formularios

...

Como se puede apreciar, el cdigo que hemos de implementar se limita a

mostrar en las distintas etiquetas de nuestra interfaz los datos
correspondientes al contacto que queremos visualizar. Para mostrar la
fotografa correspondiente, lo nico que hacemos es establecer la URL
de la imagen mostrada en la parte derecha de la tabla. Cuando
queramos utilizar este control para mostrar los datos de contacto de
alguien, lo nico que tendremos que hacer es establecer un valor
adecuado para su propiedad DisplayedContact.
Ya hemos visto en qu consiste un control ASP.NET definido por el
usuario, aunque an no hemos dicho nada acerca de cmo se crean y
cmo se utilizan los controles web en la prctica.
Para crear un control web de usuario como el que hemos utilizado de
ejemplo en este apartado, podemos utilizar tres estrategias diferentes:

- Creacin manual: Podemos seguir el mismo proceso que

hemos visto en el ejemplo para construir un control ASP.NET
escribiendo el contenido del fichero
.ascx e implementando el cdigo asociado al control en un
fichero aparte con extensin .ascx.cs. Slo hemos de tener
en cuenta que, al comienzo del fichero .ascx, debe aparecer
la directiva <%@ Control... y que el control debe heredar de
la clase System.Web.UI.UserControl.

- Conversin de una pgina ASP.NET en un control: Para

que resulte ms cmoda la creacin del control, podemos
comenzar creando un formulario ASP.NET convencional. Una
vez que el formulario haga lo que nosotros queramos,
podemos convertir la pgina ASP.NET en un control
modificando las extensiones de los ficheros. Esta estrategia
tambin es vlida cuando ya tenemos

la pgina hecha y

queremos reutilizarla. La conversin de una pgina en un

control requiere cambiar la extensin de los ficheros (de

.aspx y .aspx.cs a
.ascx y .ascx.cs), eliminar las etiquetas que no pueden
aparecer en el control

(<html>,

<head>,

<body> y

<form>, as como la directiva

<!DOCTYPE>),

cambiar

la

directiva

que

aparece

al

comienzo de la pgina (de

<%@ Page... a <%@ Control...) y modificar la clase que
implementa la funcionalidad

del

control

herede

para

que

System.Web.UI.UserControl

en

lugar

de

de
hacerlo

de

System.Web.UI.Page.
- Con Visual Studio .NET: Cuando estamos trabajando con una
aplicacin web, podemos aadir un "control de usuario web"
desde el men contextual asociado a nuestro proyecto en el
Explorador de Soluciones de Visual Studio .NET. Esto nos
permite utilizar el diseador de formularios para implementar
nuestro control igual que se implementa un formulario web
ASP.NET.
Utilizando cualquiera de las tres estrategias mencionadas, al final
obtendremos un control implementado en dos ficheros, uno para definir el
aspecto visual de la interfaz de usuario (el fichero con extensin .ascx) y
otro para el cdigo que implementa la funcionalidad del control (el fichero
que tiene extensin .ascx.cs).
Una vez que hemos creado el control, slo nos falta ver cmo utilizarlo.
Bsicamente, el control que acabamos de mostrar lo emplearemos en la
creacin de formularios web

ASP.NET como cualquier otro de los

controles que ya vimos en los apartados anteriores de este captulo. La

nica diferencia es que nuestro control no podemos ponerlo en el
"cuadro de herramientas" del Visual Studio .NET.

La forma ms sencilla de utilizar un control web creado por el usuario es,

en el mismo

entorno de desarrollo, arrastrar el control desde el

Explorador de Soluciones hasta el lugar del formulario web en el que

deseamos que aparezca nuestro control. Tras arrastrar el control a una
pgina, en el diseador de formularios veremos algo similar a lo
mostrado

en

la

siguiente

imagen:

El control que hemos creado aparece en nuestra pgina ASP.NET como

un simple botn.
<%@ Page language="c#"
Codebehind="Contacts.asp
x.cs"
AutoEventWireup="false"
Inherits="WebMail.Contac
ts" %>
<%@ Register TagPrefix="user"
TagName="ContactViewe
r"
Src="ContactViewer.as
cx" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Informacin de contacto</title>
</HEAD>
<body>
<form id="FormContacts" method="post" runat="server">
<P align="center">
<asp:DropDownList id="ContactList"
runat="server"
Width="80%"
AutoPostBack="True">
</asp:DropDownList>
<asp:Button id="ButtonOK" runat="server" Text="Mostrar">
</asp:Button></P>
<DIV align="center">
<P align="center" id="Header"
runat="server"> Informacin de
contacto de
<asp:Label id="LabelContact" runat="server">
...
</asp:Label></P>
</DIV>
<P align="center">
<user:ContactViewer id="ContactView" runat="server">
</user:ContactViewer>
</P>
</form>
</body>
</HTML>

Si observamos detenidamente la pgina ASP.NET anterior, podremos

apreciar los cambios introducidos por la inclusin de un control web de
usuario. Conociendo en qu consisten estos cambios podramos utilizar
un control definido por el usuario sin necesidad de la ayuda del entorno
de desarrollo.
En realidad, la utilizacin de un control web de usuario ocasiona que
en nuestro fichero.aspx aparecen dos novedades: una directiva al
comienzo de la pgina (la directiva <%@ Register...) y una etiqueta
ASP.NET que hace referencia a nuestro control (<user:ContactViewer...).
La directiva <%@ Register... registra el uso del control en nuestra pgina
ASP.NET, especificando el fichero donde se encuentra el control
(Src="ContactViewer.ascx") y la etiqueta que utilizaremos para incluir el
control en nuestro formulario web (mediante los atributos TagPrefix y
TagName). En cierto modo, esta directiva viene a ser como un
#define de C.

<%@ Register TagPrefix="user"

TagName="ContactView
er"

Una vez que hemos creado la forma de hacer referencia al control con la
directiva <%@ Register..., para utilizar el control en la pgina lo
incluiremos como incluiramos cualquier otro control ASP.NET, utilizando
la etiqueta que hemos definido (user:ContactViewer en el ejemplo).
Cuando lo hacemos, hemos de especificar que se trata de un control de
servidor; esto es, que el control tiene asociada funcionalidad que ha de
ejecutarse al procesar la pgina ASP.NET en el servidor. Esto lo
conseguimos con el atributo runat="server". Finalmente, lo usual es que
le asociemos un identificador al control que acabamos de incluir en la
pgina ASP.NET. Esto se logra con el atributo id="ContactView":

<user:ContactViewer id="ContactView" runat="server">

</user:ContactViewer>

Con el control incluido correctamente en la pgina ASP.NET, podemos

pasar a ver cmo se pueden manipular sus propiedades en tiempo de
ejecucin. Si estamos trabajando con el Visual Studio .NET, pulsar la
tecla F7 nos llevar del diseador de formularios web al cdigo asociado
a la pgina.
Si queremos utilizar el control desde el cdigo asociado a la pgina,
hemos de asegurarnos de que el control aparece como una variable de
instancia de la clase que implementa la funcionalidad de la pgina
ASP.NET. En otras palabras, en el fichero de cdigo con extensin
.aspx.cs debe existir una declaracin de una variable protegida que
haga referencia al control de usuario incluido en la pgina. El tipo de
esta variable coincidir con el tipo de nuestro control y su identificador ha
de coincidir con el identificador que hayamos indicado en el atributo id
de la etiqueta user:ContactViewer:

protected ContactViewer ContactView;

Volviendo al ejemplo anterior, el fichero de cdigo completo asociado a

nuestra pgina ASP.NET ser el siguiente:

El cdigo anterior se limita a establecer la propiedad DisplayedContact

de nuestro control. El valor adecuado para esta propiedad lo
obtendremos previamente de algn parmetro que le llegue a nuestra
pgina ASP.NET, de un fichero o de una base de datos. Nuestro control
se encargar internamente de visualizar los datos del contacto de la

public class Contacts : System.Web.UI.Page

{
protected System.Web.UI.WebControls.DropDownList ContactList;
protected System.Web.UI.WebControls.Label LabelContact;
protected System.Web.UI.WebControls.Button ButtonOK;
protected System.Web.UI.HtmlControls.HtmlGenericControl Header;
protected ContactViewer ContactView;
private void Page_Load(object sender, System.EventArgs e)
{
// Inicializacin de la lista desplegable
...
UpdateUI(contact);
}
// Cdigo generado por el diseador (OnInit & InitializeComponents)
...
// Manejadores de eventos
...
// Actualizacin de la interfaz

private void UpdateUI (Contact contact)

{
ContactView.DisplayedContact = contact;
Header.Visible = true;
ContactView.Visible = true;
}

forma adecuada. Al ejecutar nuestra pgina ASP.NET, el resultado final

que se le mostrar al usuario ser similar al recogido en la siguiente
figura:

Pgina ASP.NET con un control web definido por el usuario.

Funcionamiento de las pginas ASP.NET
En lo que llevamos de este captulo, hemos visto cmo se pueden
construir aplicaciones web utilizando formularios con controles de forma
completamente anloga al desarrollo de aplicaciones para Windows en
un entorno de programacin visual. Aunque disponer de un diseador de
formularios para construir aplicaciones web resulta excepcionalmente
cmodo para el programador, la semejanza con los entornos de
desarrollo para Windows puede conducir a algunos equvocos. El
objetivo de esta seccin es aclarar aquellos aspectos que diferencian la
creacin de interfaces web de la creacin de interfaces para Windows
utilizando entornos de programacin visual. La correcta comprensin de
estas diferencias resulta esencial para la correcta implementacin de
aplicaciones web.
En una pgina ASP.NET, todos los controles cuyo funcionamiento haya
de controlarse en el servidor de algn modo deben estar incluidos dentro
de un formulario HTML. Los formularios HTML han de ir delimitados por
la etiqueta estndar <form>. En el caso de ASP.NET, dicha etiqueta ha de
incluir el atributo runat="server". Este atributo le indica al servidor web

(Internet Information Server) que la pgina ASP.NET ha de procesarse en

el servidor antes de envirsela al cliente. Como consecuencia, el
esqueleto de una pgina ASP.NET ser siempre de la forma:

<form runat="server">
...
<!-- HTML y controles ASP.NET -->

El formulario HTML incluido en la pgina ASP.NET, que ha de ser

necesariamente nico, es el encargado de facilitar la interaccin del
servidor con el navegador web que el usuario final de la aplicacin utiliza
en su mquina. Aunque la forma de programar los formularios web
ASP.NET sea prcticamente idntica a la creacin de formularios para
Windows, el modo de interaccin caracterstico de las interfaces web
introduce algunas limitaciones. Estas limitaciones se deben a que cada
accin que el usuario realiza en su navegador se traduce en una solicitud
independiente al servidor web.
El hecho de que cada solicitud recibida por el servidor sea independiente
de las anteriores ocasiona que, al desarrollar aplicaciones web,
tengamos que ser conscientes de cundo se produce cada solicitud y de
cmo podemos enlazar solicitudes diferentes realizadas por un mismo
usuario.

CLASES
ACCESO A DATOS
1. Abrimos

Visual

Studio

la

versin

que

estemos

utilizando 2010 o 2012, antes de hacer toda la

programacin y conexin de la base datos en Visual
tenemos que crear la base de datos en SQLServer
2. Clic en Archivos, Nuevo, Sitio Web

3. Luego se despliega una ventana donde va a salir Nuevo

Sitio Web ubicamos la direccin donde va hacer
guardado el proyecto

4. En la parte de arriba del programa clic en Ver buscamos

EXPLORADOR DE SERVIDORES

5. Clic en Conectar a BASE DE DATOS se despliega una

ventana donde dice AGREGAR CONEXIN
6. Ponemos el Nombre del Servidor (local)

luego

seleccionamos o escribimos el nombre de la base de

datos como ejemplo InventarioGrupoA

7. Luego clic en la base de datos buscamos tablas

8. Insertamos tabla la escogemos del Cuadro de

herramientas HTML y ponemos en la primera fila
Consulta general de productos nos vamos nuevamente
al Cuadro de herramientas y buscamos en Datos
GridView luego SqlDaraSource luego Nuevo Origen de
datos y configuramos el origen de datos

9. Luego en la parte derecha del programa nos vamos

agregar una Nueva Web Forms