Sunteți pe pagina 1din 11

Escuela de Informtica y Telecomunicaciones

Controles Avanzados ASP.Net


LDP3501-2011 / DUOC-AV

En esta gua:
Controles de validacin ASP.NET (repaso) ....................................................................... 1
Utilizar controles de validacin.................................................................................... 1
Cundo se produce la validacin ................................................................................................1
Validar mltiples condiciones.....................................................................................................2
Mostrar la informacin de errores .............................................................................................2
Validar entradas requeridas para controles de servidor ASP.NET................................. 3
Validar con respecto a un valor especfico para controles de servidor ASP.NET ........... 4
Validar con respecto a un intervalo de valores para controles de servidor ASP.NET ..... 5
Validar con una funcin personalizada para controles de servidor ASP.NET ................ 5
Controles MultiView y View ............................................................................................ 7
El control MultiView .................................................................................................... 7
El control View ............................................................................................................ 8
Desplazamiento entre Vistas ....................................................................................... 9
Escuela de Informtica y Telecomunicaciones

Controles de validacin ASP.NET (repaso)


Un aspecto importante de la creacin de pginas Web ASP.NET para la entrada de datos por el usuario
consiste en poder comprobar que la informacin que introducen los usuarios es vlida. ASP.NET ofrece un
conjunto de controles de validacin que proporciona una forma eficaz y fcil de usar para comprobar
errores y, si es necesario, mostrar mensajes al usuario.

Mediante los controles de validacin se puede agregar validacin de entrada a las pginas Web ASP.NET. Los
controles de validacin proporcionan un mecanismo fcil de utilizar para todos los tipos comunes de
validacin estndar (por ejemplo, probar fechas vlidas o valores comprendidos en un intervalo), adems de
otras formas para proporcionar validacin escrita personalizada. Adems, los controles de validacin
permiten personalizar completamente cmo se muestra la informacin de errores al usuario.

Los controles de validacin se pueden utilizar con cualquier control que se coloque en una pgina Web
ASP.NET, incluidos los controles HTML y de servidor Web.

Utilizar controles de validacin


Habilitar la validacin de los datos introducidos por el usuario, es posible agregando controles de validacin
a la pgina como lo hara con otros controles de servidor. Existen controles para distintos tipos de
validacin, como la comprobacin de un intervalo o la comparacin de modelos. Para obtener una lista
completa de los tipos de validacin, vea Tipos de validacin para controles de servidor ASP.NET. Cada
control de validacin hace referencia a un control de entrada (un control de servidor) situado en otra parte
de la pgina. Cuando se procesan los datos introducidos por el usuario (por ejemplo, cuando se enva una
pgina), el control de validacin comprueba dichos datos y establece una propiedad para indicar si han
pasado la comprobacin. Una vez que se ha llamado a todos los controles de validacin, se establece una
propiedad en la pgina que indica si alguna de las comprobaciones de validacin ha producido un error.

Los controles de validacin se pueden asociar en grupos de validacin a fin de que los controles que
pertenezcan a un grupo comn se validen juntos. Puede utilizar estos grupos para habilitar o deshabilitar de
forma selectiva la validacin para controles relacionados en una pgina. Otras operaciones de validacin,
como mostrar un control ValidationSummary o llamar al mtodo GetValidators, pueden hacer referencia al
grupo de validacin.

En su propio cdigo puede probar el estado de la pgina y de los controles individuales. Por ejemplo, se
podra probar el estado de los controles de validacin antes de actualizar un registro de datos con
informacin introducida por el usuario. Si se detecta un estado no vlido, se omite la actualizacin.
Normalmente, si una comprobacin de validacin produce errores, se omite todo el procesamiento y se
devuelve la pgina al usuario. Los controles de validacin que detectan errores generan un mensaje de error
que aparece en la pgina. Puede mostrar todos los errores de validacin en un solo lugar mediante un
control ValidationSummary.

Cundo se produce la validacin


Los controles de validacin ejecutan la comprobacin de los datos introducidos en el cdigo del servidor.
Cuando el usuario enva una pgina al servidor, los controles de validacin se invocan para comprobar los
datos introducidos por el usuario, control a control. Si se detecta un error de validacin en uno de los

Pgina 1
Escuela de Informtica y Telecomunicaciones

controles de entrada de datos, la propia pgina se establece en un estado no vlido para que se pueda
probar la validez antes de ejecutar el cdigo. La validacin se produce despus de la inicializacin de la
pgina (es decir, despus de que el estado de vista y los datos devueltos se hayan procesado) pero antes de
llamar a los controladores de eventos Change o Click.

Si el usuario est trabajando con un explorador compatible con ECMAScript (Javascript), los controles de
validacin tambin pueden realizar la validacin mediante secuencias de comandos del cliente. Esto puede
mejorar el tiempo de respuesta de la pgina, ya que los errores se detectan inmediatamente y los mensajes
de error se muestran en cuanto el usuario abandona el control que contiene el error. Si la validacin est
disponible en el cliente, se obtiene ms control sobre la presentacin de los mensajes de error y se puede
mostrar un resumen de errores en un cuadro de mensaje.

ASP.NET ejecuta una validacin en el servidor aunque los controles de validacin la hayan ejecutado en el
cliente, por lo que puede probar la validez en los controladores de eventos basados en el servidor. Adems,
la nueva comprobacin en el servidor ayuda a evitar que los usuarios puedan omitir la validacin
deshabilitando o cambiando la secuencia de comandos del cliente.

Validar mltiples condiciones


Cada control de validacin normalmente realiza una comprobacin. No obstante, es posible que se deseen
comprobar mltiples condiciones. Por ejemplo, supongamos que desea especificar que una entrada de
usuario es necesaria y que slo puede contener fechas dentro de un intervalo especificado.

En las pginas se puede asociar ms de un control de validacin a cada control de entrada. En ese caso, las
comprobaciones realizadas por los controles se resuelven utilizando un operador lgico AND, lo que significa
que los datos introducidos por el usuario deben pasar todas las comprobaciones para que se consideren
vlidos.

En algunos casos podran ser entradas vlidas en varios formatos distintos. Por ejemplo, si solicita un
nmero de telfono, puede permitir que los usuarios introduzcan un nmero local, un nmero de larga
distancia o un nmero internacional. El uso de mltiples controles de validacin no funcionara en esta
instancia, ya que los datos introducidos por el usuario deben pasar todas las comprobaciones para ser
vlidos. Para realizar este tipo de comprobacin, que es una operacin lgica OR en la que slo se debe
pasar una comprobacin, utilice el control de validacin RegularExpressionValidator y especifique mltiples
modelos vlidos en el control. Opcionalmente, puede utilizar el control de validacin CustomValidator y
escribir su propio cdigo de validacin.

Mostrar la informacin de errores


Normalmente, los controles de validacin no son visibles en la pgina presentada. No obstante, si el control
detecta un error, muestra el texto del mensaje de error que se especifique. El mensaje de error se puede
mostrar de formas diferentes, como se indica en la tabla siguiente.

Presentacin Descripcin
En contexto Cada control de validacin puede mostrar su propio mensaje de error en
contexto (normalmente junto al control donde se ha producido el error).

Pgina 2
Escuela de Informtica y Telecomunicaciones

Presentacin Descripcin
Resumen Los errores de validacin pueden recopilarse y mostrarse en un lugar,
por ejemplo, en la parte superior de la pgina. Esta estrategia se utiliza a
menudo junto con la presentacin de un mensaje al lado de los campos
de entrada con errores. Si el usuario trabaja con Internet Explorer 4.0 o
posterior, el resumen puede mostrarse en un cuadro de mensaje.
Si utiliza grupos de validacin, necesita un control ValidationSummary
para cada uno de ellos.

En contexto y en un resumen El mensaje de error puede ser diferente en el resumen y en contexto.


Puede utilizar esta opcin para mostrar un mensaje de error ms corto
en el contexto y con ms detalles en el resumen.

Personalizado Puede personalizar la presentacin del mensaje de error capturando la


informacin de error y diseando su propio resultado.

Validar entradas requeridas para controles de servidor ASP.NET


Puede especificar que el usuario proporcione informacin en un control determinado en una pgina Web
ASP.NET agregando un control RequiredFieldValidator a la pgina y vinculndolo al control requerido. Por
ejemplo, puede especificar que los usuarios rellenen un cuadro de texto Nombre antes de que puedan
enviar un formulario de registro.

Si la validacin se realiza en el cliente, el usuario puede dejar en blanco un campo obligatorio (o con el valor
predeterminado) mientras trabaja en la pgina, pero debe proporcionar un valor que no sea el
predeterminado antes de enviar la pgina. Sin embargo, una vez que un valor se ha especificado en el
campo, el usuario no puede borrar el campo (o devolverle su valor predeterminado). Si se limpia el campo,
el usuario ve un mensaje de error inmediatamente cuando deja el campo. En la validacin en el servidor, no
se realiza ninguna validacin hasta que se enva la pgina, por lo que el usuario no ver un mensaje de error
hasta despus de que se enve la pgina.

Para validar una entrada requerida

Agregue un control RequiredFieldValidator a la pgina y establezca las propiedades siguientes:

Propiedad Descripcion
ControltoValidate El Id. del control para el que el usuario debe proporcionar un valor.

ErrorMessage, Text, Display Propiedades que especifican el texto y ubicacin del error o errores que
aparecern si el usuario omite el control.

Pgina 3
Escuela de Informtica y Telecomunicaciones

Validar con respecto a un valor especfico para controles de servidor ASP.NET


Con los controles de validacin de ASP.NET se puede validar la entrada de un usuario con respecto a un
valor concreto utilizando los operadores lgicos. Por ejemplo, puede especificar que la entrada del usuario
sea una fecha posterior a 1 de enero de 1950 o que sea un valor entero mayor o igual que cero. Tambin
puede especificar que la entrada del usuario se compare con un valor de otro control.

Para validar con un valor especfico

Agregue un control CompareValidator a la pgina y establezca las propiedades siguientes:

Propiedad Descripcion
ControlToValidate El Id. del control para el que el usuario debe proporcionar un valor.

ErrorMessage, Text, Display Propiedades que especifican el texto y ubicacin del error o errores que
aparecern si el usuario omite el control.

Para definir el valor que se va a comparar, establezca las siguientes propiedades:

Propiedad Descripcion
ValueToCompare Expresin especificada como una cadena. Para comparar con un valor
O bien constante, establezca la propiedad ValueToCompare. Para realizar una
ControlToCompare comparacin con respecto al valor de otro control, establezca la propiedad
ControlToCompare en el Id. de ese control. (El control CompareValidator
compara la entrada del usuario con la propiedad que haya especificado
ValidationPropertyAttribute del otro control). Si define las dos
propiedades, ValueToCompare y ControlToCompare, ControlToCompare
tiene prioridad.

Type El tipo de datos de los dos valores que se van a comparar. Los tipos se
especifican mediante la enumeracin ValidationDataType, que permite
utilizar el nombre de tipo String, Integer, Double, Date o Currency. Los
valores se convierten a este tipo antes de realizar la comparacin.

Operator Comparacin que se va a utilizar. Especifique un operador utilizando uno


de los valores siguientes definido en la enumeracin
ValidationCompareOperator:
Equal
NotEqual
GreaterThan
GreaterThanEqual
LessThan
LessThanEqual
DataTypeCheck

Pgina 4
Escuela de Informtica y Telecomunicaciones

Validar con respecto a un intervalo de valores para controles de servidor ASP.NET


Puede utilizar el control RangeValidator de ASP.NET para determinar si una entrada del usuario entra
dentro de un intervalo determinado de valores; por ejemplo, entre dos nmeros, entre dos fechas o entre
caracteres alfabticos. Puede establecer los lmites superior e inferior del intervalo como propiedades de un
control RangeValidator. Debe especificar tambin el tipo de datos de los valores que el control validar. Si el
tipo de la entrada del usuario no se puede convertir en el tipo de datos especificado (por ejemplo, una
fecha), la validacin producir un error.

Para validar con un intervalo de valores

Agregue un control RangeValidator a la pgina y establezca las propiedades siguientes:

Propiedad Descripcion
ControlToValidate El Id. del control para el que el usuario debe proporcionar un valor.

ErrorMessage, Text, Display Propiedades que especifican el texto y ubicacin del error o errores que
aparecern si el usuario omite el control.

Establezca los valores inferior y superior del intervalo utilizando las propiedades MinimumValue y
MaximumValue.

Establezca la propiedad Type para especificar el tipo de datos de los valores del intervalo. Utilice la
enumeracin ValidationDataType, que le permitir especificar los tipos siguientes: String, Integer, Double,
Date y Currency.

Si el usuario deja un control en blanco, el control pasa la validacin de intervalo. Para hacer que el usuario
escriba un valor, agregue tambin un control RequiredFieldValidator

Validar con una funcin personalizada para controles de servidor ASP.NET


Si los controles de validacin ASP.NET existentes no se ajustan a sus necesidades, puede definir una funcin
de validacin en el servidor personalizada y llamarla mediante el control CustomValidator. Tambin puede
agregar la validacin en el cliente para comprobar los datos proporcionados por el usuario antes de que se
enve la pgina, escribiendo una funcin en ECMAScript (JavaScript) que duplique la lgica del mtodo de
servidor.

Debera realizar la validacin en el servidor an cuando utilice una comprobacin en el cliente. La validacin
en el servidor ayuda a evitar que los usuarios omitan la validacin deshabilitando o cambiando la secuencia
de comandos del cliente.

Para validar en el servidor utilizando una funcin personalizada

Agregue un control CustomValidator a la pgina y establezca las propiedades siguientes:

Pgina 5
Escuela de Informtica y Telecomunicaciones

Propiedad Descripcion
ControlToValidate El Id. del control para el que el usuario debe proporcionar un valor.

ErrorMessage, Text, Display Propiedades que especifican el texto y ubicacin del error o errores que
aparecern si el usuario omite el control.

Cree un controlador de eventos de servidor para el evento ServerValidate del control. Para realizar la
validacin se llama a este evento. El mtodo tiene una firma como la siguiente:

protected void ValidationFunctionName(object source, ServerValidateEventArgs


args)
{
}

El parmetro source es una referencia al control de validacin personalizado que inicia este evento. La
propiedad args.Value contiene los datos proporcionados por el usuario que se van a validar. Establezca
args.IsValid en true si el valor es vlido; de lo contrario, es false.

Para crear una lgica de validacin personalizada en el cliente

Cree una funcin de validacin en ECMAScript (JavaScript, JScript). En el siguiente ejemplo de cdigo se
muestra una validacin personalizada en el cliente. Un fragmento de la pgina muestra un control TextBox
al que hace referencia un control CustomValidator. El control de validacin llama a una funcin de secuencia
de comandos de cliente denominada validateLength para asegurarse de que el usuario ha escrito al menos
ocho caracteres en el control TextBox.

<script type="text/javascript">
function ValidaLargo(oSrc, args)
{
args.IsValid = (args.Value.length >= 8);
}
</script>

<asp:Textbox id="text1" runat="server" text=""></asp:Textbox>


<asp:CustomValidator id="CustomValidator2" runat="server"
ControlToValidate = "text1"
ErrorMessage = "El texto debe ser de largo 8 como mnimo"
ClientValidationFunction="ValidaLargo" >
</asp:CustomValidator>

Pgina 6
Escuela de Informtica y Telecomunicaciones

Controles MultiView y View

Los controles MultiView y View de servidor Web actan como contenedores para otros controles y
proporcionan un medio para presentar de forma sencilla vistas alternativas de la informacin. Se pueden
utilizar los controles MultiView y View para realizar tareas como las siguientes:

Proporcionar conjuntos de controles alternativos basados en la eleccin del usuario o en otras


condiciones. Por ejemplo, se podra permitir a los usuarios hacer su seleccin en una lista de
suministros, cada uno de los cuales estara configurado en un control View diferente. A
continuacin, se mostrara el control View que contiene la eleccin de suministros del usuario. Se
pueden utilizar los controles MultiView y View como alternativa para no crear varios controles
Panel.

Crear un formulario de varias pginas. Los controles MultiView y View pueden tener un
comportamiento similar al del control Wizard. El control Wizard resulta especialmente apropiado
para crear formularios que los usuarios rellenan paso a paso. El control Wizard tambin es
compatible con otros elementos integrados de la interfaz de usuario, como un encabezado y pie de
pgina, con los botones Anterior y Siguiente, y con las plantillas. Podra utilizar un control
MultiView en lugar de un control Wizard si deseara crear una presentacin que cambiara en
funcin de una condicin (y no de forma secuencial) o si no necesitara utilizar las caractersticas
adicionales admitidas por el control Wizard.

El control MultiView acta como un contenedor externo para uno o varios controles View. Los controles
View, a su vez, pueden contener cualquier combinacin de marcado y controles. El control MultiView
muestra un control View por vez, y expone tambin el marcado y los controles incluidos en ese control View.
Al definir la propiedad ActiveViewIndex del control MultiView, puede especificar qu control View est
visible actualmente.

Si no se selecciona un control View, ste no se representa en la pgina. Sin embargo, las instancias de todos
los controles de servidor Web incluidos en los controles View se crean cada vez que se representa la pgina,
y sus valores se almacenan como parte del estado de vista de la pgina.

Ni el control MultiView ni los controles View individuales representan ningn otro marcado en la pgina que
el contenido del control View actual. Por ejemplo, los controles no representan un elemento div del mismo
modo que un control Panel. Sin embargo, tampoco admiten propiedades de aspecto que se puedan aplicar
en conjunto al control View actual, aunque puede asignar un tema a los controles MultiView o View para
que este tema se aplique a todos los controles secundarios del control View actual.

El control MultiView

El control MultiView es un contenedor para un grupo de controles View. Permite definir un grupo de
controles View en el que cada control View contiene controles secundarios. A continuacin, la aplicacin
puede representar un control View concreto en el cliente basndose en criterios como la identidad del

Pgina 7
Escuela de Informtica y Telecomunicaciones

usuario, las preferencias del usuario e informacin pasada en un parmetro de cadena de consulta. El
control MultiView tambin se puede utilizar para crear asistentes (Wizard). En este escenario, cada control
View contenido en un control MultiView representa un paso o pgina diferente del asistente. Este control
tambin se debe utilizar para desarrollar aplicaciones de mltiples pantallas para dispositivos mviles.

Slo se puede definir un control View a la vez como vista activa en un control MultiView. Cuando un control
View est definido como la vista activa, los controles secundarios que contiene se representan en el cliente.
Puede utilizar la propiedad ActiveViewIndex o el mtodo SetActiveView para definir la vista activa. Si la
propiedad ActiveViewIndex est vaca, el control MultiView no representa contenido en el cliente. Si la vista
activa se establece en un control View que no existe en el control MultiView, se produce una excepcin
ArgumentOutOfRangeException en tiempo de ejecucin.

La vista activa se puede definir mediante programacin o mediante declaracin. Si la propiedad


ActiveViewIndex se establece mediante declaracin al definir el control MultiView, se provoca que el control
View establecido como la vista activa se represente en el cliente la primera vez que se llama al control
MultiView. En el ejemplo de cdigo siguiente se muestra cmo establecer la propiedad ActiveViewIndex
mediante declaracin:

<asp:MultiView id="MultiView1" ActiveViewIndex=0 runat="Server">

Si la propiedad ActiveViewIndex se establece mediante programacin o mediante una llamada al mtodo


SetActiveView, la aplicacin puede determinar qu control View se va a representar en el cliente en tiempo
de ejecucin segn criterios como la identidad o las preferencias del usuario.

Para permitir a los usuarios navegar entre los controles View dentro de un control MultiView, puede agregar
un control LinkButton o Button a cada control View. Para aprovecharse de la actualizacin automtica en el
control MultiView del control View actualmente activo, establezca la propiedad CommandName del botn o
botn de vnculo en el valor de uno de los campos de nombre de comando siguientes que corresponda al
comportamiento de navegacin deseado: PreviousViewCommandName, NextViewCommandName,
SwitchViewByIDCommandName o SwitchViewByIndexCommandName.

El control View

El control View es un contenedor de un grupo de controles. Un control View siempre debe estar contenido
dentro de un control MultiView. Slo se puede definir un control View a la vez como vista activa en un
control MultiView.

La propiedad ActiveViewIndex especifica el control View activo dentro de la coleccin Views de un control
MultiView. El control de vista activa se representa en el cliente, siempre y cuando el control MultiView
contenedor est visible. Utilice la propiedad Visible para determinar si un control View y sus controles
secundarios estn visibles en la pgina y se representan en el cliente.

Pgina 8
Escuela de Informtica y Telecomunicaciones

Un control View puede contener controles de cualquier tipo, incluidos otros controles MultiView. Un control
View no admite propiedades de estilo. Para aplicar estilos a un control View, agregue uno o ms controles
Panel al control View.

La clase View proporciona los eventos Activate y Deactivate. Se provoca el evento Activate cuando el
control View actual se convierte en la vista activa. Esto ocurre cuando el valor de la propiedad
ActiveViewIndex cambia o se llama al mtodo SetActiveView para especificar un control View diferente. Por
ejemplo, si View1 es la vista activa en un control MultiView, cuando cambie la propiedad ActiveViewIndex
para especificar View2, se generar el evento Activate para View2 y el evento Deactivate para View1.

Para permitir a los usuarios navegar entre varios controles View contenidos en un control MultiView, se
puede agregar un control LinkButton o Button a cada control View. Establezca la propiedad CommandName
del control LinkButton o Button en el Id. del control View al que desee navegar. El siguiente ejemplo
muestra el cdigo cliente y de servidor, que permitira una navegacin entre vistas asistida por un
LinkButton:

/* Cdigo cliente ASP.Net */


<asp:LinkButton id="lnkNoticias"
Text="Ir a la vista de Noticias"
OnCommand=" lnkNoticias_Command"
CommandArgument="Noticias"
Width="150px"
runat="Server">
</asp:LinkButton>

/* Cdigo del Servidor */


protected void lnkNoticias_Command(object sender, CommandEventArgs e)
{
// Determina cual botn fue clickeado, para activar la vista respectiva
switch (e.CommandArgument.ToString())
{
case "Inicio":
MultiView1.SetActiveView(VistaInicio);
break;
case "Noticias":
MultiView1.SetActiveView(VistaNoticias);
break;
case "Compras":
MultiView1.SetActiveView(VistaCompras);
break;
}

Desplazamiento entre Vistas

Puede desplazarse entre las vistas estableciendo la propiedad ActiveViewIndex del control MultiView en el
valor del ndice del control View que se va a mostrar. El control MultiView tambin es compatible con
botones de desplazamiento, que se pueden agregar a cada control View. Para crear botones de
desplazamiento, puede agregar un control de botn (Button, LinkButton o ImageButton) a cada control

Pgina 9
Escuela de Informtica y Telecomunicaciones

View. Puede establecer las propiedades CommandName y CommandArgument de cada botn en valores
reservados para hacer que el control MultiView se desplace a otra vista. En la tabla siguiente se muestran los
valores CommandName reservados y los valores CommandArgument correspondientes:

Valor de CommandName Valor de CommandArgument

NextView (sin valor)

PrevView (sin valor)

SwitchViewByID Id. del control View al que cambia.

SwitchViewByIndex Nmero de ndice del control View al que cambia.

En el ejemplo siguiente se muestra un control MultiView con tres controles View. Cada control View
contiene un control Button que se desplaza a un control View concreto.

<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">


<asp:View ID="View1" runat="server">
View 1<br />
<br />
<asp:Button ID="Button1" runat="server"
CommandArgument="View2"
CommandName="SwitchViewByID"
Text="Ir a View 2" />
</asp:View>
<asp:View ID="View2" runat="server">
View 2<br />
<br />
<asp:Button ID="Button2" runat="server"
CommandArgument="View3"
CommandName="SwitchViewByID"
Text="Ir a View 3" />
</asp:View>
<asp:View ID="View3" runat="server">
View 3<br />
<br />
<asp:Button ID="Button3" runat="server"
CommandArgument="View1"
CommandName="SwitchViewByID"
Text=Ir a View 1" />
</asp:View>
</asp:MultiView></div>

Pgina 10

S-ar putea să vă placă și