Compartir a través de


Tutorial: Validar los datos introducidos por el usuario en una página de formularios Web Forms

Actualización: noviembre 2007

Este tutorial muestra cómo utilizar los controles validadores de ASP.NET para comprobar los datos proporcionados por el usuario en una página Web. Trabajará con controles que realizan todas las comprobaciones automáticamente, sin necesidad de código. También creará un validador que personalizará mediante código; de ese modo se ilustra cómo se puede agregar lógica al marco de trabajo de validación en la página. Finalmente, obtendrá información acerca de cómo se pueden validar condicionalmente los datos proporcionados por el usuario, de acuerdo con las opciones que elige éste en una página.

En el tutorial creará una página de un sitio Web que permita a los visitantes solicitar una reserva. Dado que la finalidad del tutorial consiste en ilustrar la validación, la clase de reserva no es importante en este contexto (por ejemplo, podría ser para un restaurante, una sala de reuniones de un centro social u otro tipo de reserva) y la página no procesa realmente la reserva.

En la página que va a crear se pedirá al usuario una dirección de correo electrónico, el número de personas para las que solicita reserva y una fecha preferida. La página también permite al usuario solicitar confirmación telefónica de la reserva. (La opción predeterminada para esta página, si se implementase, sería una confirmación por correo electrónico).

Nota de seguridad:

De manera predeterminada, la página de formularios Web Forms comprueba que usuarios malintencionados no estén intentando enviar script a la aplicación. Para obtener más información, vea Información general sobre los ataques mediante secuencias de comandos.

Durante este tutorial aprenderá a:

  • Utilizar los controles validadores para comprobar los datos proporcionados por el usuario en una página Web ASP.NET.

  • Dar formato a la presentación de los mensajes de error de validación.

  • Crear una validación personalizada mediante código.

Requisitos previos

Para poder completar este tutorial, necesitará:

  • Visual Studio y .NET Framework.

Crear el sitio y la página Web

En la primera parte del tutorial creará un sitio Web y una página en la que podrá trabajar con estilos.

Si ya ha creado un sitio Web con Visual Studio (por ejemplo, siguiendo los pasos descritos en el tema Tutorial: Crear una página Web básica en Visual Web Developer), puede utilizar ese sitio Web y pasar directamente al apartado sobre cómo agregar controles, que figura más adelante en este tutorial. De lo contrario, cree un sitio Web y una página nuevos siguiendo estos pasos.

Para crear un sitio Web del sistema de archivos

  1. Abra Visual Studio.

  2. En el menú Archivo, haga clic en NuevoSitio Web.

    Aparece el cuadro de diálogo Nuevo sitio Web.

  3. En la lista Lenguaje, haga clic en el lenguaje de programación con el que prefiera trabajar.

    El lenguaje de programación que elija será el lenguaje predeterminado de su sitio Web, sin embargo, también puede establecer el lenguaje de programación de cada página de forma individual.

  4. En Plantillas instaladas de Visual Studio, haga clic en Sitio Web de ASP.NET.

  5. En el cuadro Ubicación, escriba el nombre de la carpeta en la que desea conservar las páginas de su sitio Web.

    Por ejemplo, escriba el nombre de carpeta C:\WebSites.

  6. Haga clic en Aceptar.

    Visual Studio crea la carpeta y una nueva página denominada Default.aspx.

Agregar controles

Utilizará un número reducido de controles para pedir al usuario la información necesaria para la reserva.

Para agregar controles y texto

  1. Cambie a la vista Diseño.

  2. Escriba un encabezado de página, como Enviar una reserva.

  3. Desde el grupo Estándar del Cuadro de herramientas, arrastre los controles siguientes a la página y establezca sus propiedades tal como se indica.

    1. Control

    1. Propiedades

    TextBox

    ID: textEmail

    TextBox

    ID: textNumberInParty

    TextBox

    ID: textPreferredDate

    Button

    ID: buttonSubmit

    Text: Enviar solicitud

    ValidationGroup: AllValidators

    Label

    ID: labelMessage

    Text: (en blanco)

    Nota:

    El diseño exacto de la página no es importante.

  4. Escriba el texto delante de los cuadros de texto como títulos.

  5. Haga doble clic en el botón Submit Request con objeto de crear un controlador para su evento Click y, a continuación, agregue el código resaltado que se muestra a continuación:

    Protected Sub buttonSubmit_Click(ByVal sender As Object, _
           ByVal e As System.EventArgs)
        If Page.IsValid Then      labelMessage.Text = "Your reservation has been processed."    End If
    End Sub
    
    protected void buttonSubmit_Click(object sender, EventArgs e)
    {
        if (Page.IsValid)    {      labelMessage.Text = "Your reservation has been processed.";    }
    }
    

    El controlador del botón sólo muestra un mensaje; no realiza ningún procesamiento real. Sin embargo, la presentación del mensaje le permitirá probar más adelante en el tutorial el efecto de la validación.

  6. Cambie a la vista Diseño, haga doble clic en un área en blanco en la página para crear un controlador Page_Load y, a continuación, agregue el código resaltado que se muestra a continuación:

    Protected Sub Page_Load(ByVal sender As Object, _
        ByVal e As EventArgs)
       labelMessage.Text = ""
    End Sub
    
    protected void Page_Load(object sender, EventArgs e)
    {
        labelMessage.Text = "";
    }
    

    Este código borra el mensaje que muestra la página después de la validación completa. El código servirá de ayuda en las pruebas posteriores del tutorial.

Agregar validación básica

Para su sistema de reservas imaginario, necesitará que se realicen las siguientes comprobaciones de validación:

  • La dirección de correo electrónico es obligatoria y su formato tiene que ser correcto; por ejemplo, alguien@ejemplo.com. (Por lo general, no es viable comprobar si la dirección de correo electrónico es real; no obstante, sí se puede comprobar que se ajusta al modelo correspondiente a las direcciones de correo electrónico).

  • También es necesario el número de personas, que debe ser un valor numérico.

  • Se necesita la fecha preferida.

Puede agregar todos estos criterios de validación mediante controles validadores, que se encargan de realizar las comprobaciones y muestran los errores automáticamente.

Nota:

Más adelante en el tutorial agregará otra comprobación para asegurarse de que los usuarios escriben una fecha válida.

Para agregar una validación básica

  1. Cambie a la vista Diseño. Desde el grupo Validación del Cuadro de herramientas, arrastre un control RequiredFieldValidator y colóquelo junto al cuadro de texto textEmail.

  2. Establezca las siguientes propiedades del control RequiredFieldValidator:

    Propiedad

    Ajuste

    ControlToValidate

    textEmail

    Enlaza el control validador al cuadro de texto cuyo contenido desea validar.

    Display

    Dinámico

    Especifica que el control sólo representa (y ocupa espacio en la página) si es necesario para mostrar un error.

    ErrorMessage

    Se requiere la dirección de correo electrónico.

    Muestra texto en un resumen de error, que configurará más adelante en el tutorial.

    Text

    *

    Para indicar que un campo es obligatorio, se suele utilizar como convención un signo en forma de estrella. Sólo se mostrará este texto en caso de error.

    ValidationGroup

    AllValidators

    Al igual que ocurre con los botones de opción, es posible reunir los validadores en grupos que se tratan como una unidad. Más adelante en este tutorial se ofrece información sobre cómo agrupar los validadores.

    Se agrega una prueba a lo que ha hecho para asegurarse de que el usuario escribe una dirección de correo electrónico. El control validador realiza todas las operaciones de comprobación y presentación de errores, lo que requiere que agregue código a la página.

  3. Desde el grupo Validación del Cuadro de herramientas, arrastre un control RegularExpressionValidator y colóquelo junto al control RequiredFieldValidator recién agregado.

  4. Establezca las siguientes propiedades del control RegularExpressionValidator:

    1. Propiedad

    1. Ajuste

    ControlToValidate

    textEmail

    Está validando de nuevo la entrada del usuario en el cuadro correspondiente al correo electrónico.

    Display

    Dinámico

    ErrorMessage

    Las direcciones de correo electrónico deben estar en el formato nombre@dominio.xyz.

    Un mensaje de error más largo.

    Text

    Formato no válido.

    Un mensaje de error corto.

    ValidationGroup

    AllValidators

    Al igual que ocurre con los botones de opción, es posible reunir los validadores en grupos que se tratan como una unidad. Más adelante en este tutorial se ofrece información sobre cómo agrupar los validadores.

  5. Con el control RegularExpressionValidator todavía seleccionado, haga clic en el botón de puntos suspensivos en el cuadro ValidationExpression de la ventana Propiedad.

    Las expresiones regulares constituyen un lenguaje que se puede utilizar para buscar con precisión modelos definidos en cadenas. En el control RegularExpressionValidator, defina una expresión regular para el modelo válido (en este caso, el modelo de una dirección de correo electrónico válida).

    El Editor de expresiones regulares contiene una lista de expresiones regulares utilizadas con frecuencia para que pueda usar el control validador sin tener que conocer la sintaxis de las expresiones regulares.

  6. En la lista Expresiones estándar, haga clic en Dirección de correo electrónico de Internet.

    La expresión regular para una dirección de correo electrónico se coloca en el cuadro Expresión de validación.

  7. Haga clic en Aceptar para cerrar el cuadro de diálogo.

  8. Agregue otro control RequiredFieldValidator según las instrucciones de los pasos 1 a 3. Sin embargo, en esta ocasión deberá enlazarlo al cuadro de texto textNumberInParty y establecer su propiedad ErrorMessage como Indique cuántas personas hay en la fiesta.

  9. Desde el grupo Validación del Cuadro de herramientas, arrastre un control RangeValidator y colóquelo junto al control RequiredFieldValidator recién agregado.

  10. Establezca las siguientes propiedades del control RangeValidator:

    1. Propiedad

    1. Ajuste

    ControlToValidate

    textNumberInParty

    Display

    Dinámico

    ErrorMessage

    Escriba un número entre 1 y 20 para indicar el número de las personas en la fiesta.

    MaximumValue

    20

    En este caso, un valor arbitrario pero alto.

    MinimumValue

    1

    En esta aplicación, para una reserva se requiere por lo menos una persona.

    Text

    Escriba un número entre 1 y 20.

    Type

    Entero

    ValidationGroup

    AllValidators

    El control RangeValidator realiza dos funciones: garantiza que los datos que introduce un usuario son numéricos y comprueba que el número introducido se encuentra entre los valores mínimo y máximo especificados.

Probar la página

Ahora puede probar los controles validadores que tiene hasta el momento.

Para probar la validación básica

  1. Presione CTRL+F5 para ejecutar la página.

  2. Cuando la página aparece en el explorador, haga clic en el botón Submit Request.

    Se muestran varios errores de validación porque no ha rellenado algunos campos necesarios. Observe que se muestran los errores de validación inmediatamente. No se envía la página. De forma predeterminada, los controles validadores insertan ECMAScript de cliente (JavaScript) en la página para realizar una comprobación de validación en el explorador. Esto proporciona a los usuarios información instantánea sobre errores de validación; sin script de cliente, para la comprobación de errores de validación se necesitaría una acción de ida y vuelta al servidor, lo que en ocasiones podría resultar lento. De hecho, no es posible enviar la página hasta que se pasen todas las comprobaciones de validación en el cliente. (Como medida de seguridad, se realiza de nuevo la misma comprobación de validación cuando se envía la página).

  3. Compruebe la validación en el cuadro de texto textEmail; para ello, escriba una dirección de correo electrónico no válida y, a continuación, repita la prueba con una dirección de correo electrónico válida, como la suya.

  4. Compruebe que sólo se pueden escribir valores numéricos entre el 1 y el 20 en el cuadro de texto Número de personas de la fiesta.

  5. Cuando haya escrito los valores válidos, haga clic en el botón Enviar solicitud. Si la validación pasa todos los controles, verá el mensaje Se ha procesado su reserva.

  6. Después de haber confirmado que esa validación funciona según lo previsto, cierre el explorador.

Si la validación no funciona según lo previsto, asegúrese de que ha establecido todos los valores de configuración de propiedades enumerados anteriormente y después ejecute de nuevo la página.

Formas alternativas de mostrar información de errores

De forma predeterminada, los controles validadores muestran el texto de los errores en contexto; es decir, muestran el valor de la propiedad Text del control en la ubicación que tiene el control en la página. En ocasiones quizá desee que la información de los errores se muestre de otro modo. Los controles validadores de ASP.NET le proporcionan estas opciones adicionales:

  • Resumir todos los errores de validación en un lugar. Puede hacerlo además de que se muestren los errores en contexto, o como alternativa a esa presentación. Si se muestran los resúmenes de error, también es posible mostrar mensajes de error más largos.

  • Mostrar un mensaje emergente en el explorador con información de error. Esta opción solo funciona en exploradores habilitados para el uso de script.

Puede agregar estas dos opciones de presentación con el control ValidationSummary. En esta parte del tutorial, agregará ambas características de presentación a la página.

Para que se muestre información de validación de formas alternativas

  1. Arrastre un control ValidationSummary desde el grupo Validación del Cuadro de herramientas hasta la página.

  2. Establezca la propiedad ValidationGroup del control ValidationSummary como AllValidators.

  3. Ejecute la página.

  4. Realice las mismas pruebas que realizó anteriormente en el tutorial.

    Para cada error verá información en dos lugares. Se muestra un mensaje de error corto (el valor de la propiedad Text del control validador) donde se encuentra el control validador. El mensaje de error más largo (el valor de la propiedad ErrorMessage del control) se muestra en el control ValidationSummary.

  5. Cierre el explorador.

  6. Establezca la propiedad ValidationSummary del control ShowMessageBox en true.

  7. Ejecute la página.

  8. Realice las mismas pruebas.

    En esta ocasión, cada error produce un mensaje emergente en el explorador.

  9. Cierre el explorador.

Agregar validación personalizada para comprobar la entrada de la fecha

Entre los controles de validación de ASP.NET no se incluye ninguno que compruebe automáticamente la validez de la fecha. Sin embargo, puede utilizar el control CustomValidator con ese fin. El validador personalizado permite escribir código de validación propio para comprobar cualquier condición que necesite la aplicación. En este tutorial utilizará el control CustomValidator para comprobar que el valor que escribe el usuario en el cuadro de texto textPreferredDate se puede convertir en un valor de fecha.

Agregará dos bloques de código de validación personalizado. El primero es el código de validación personalizado que se ejecuta cuando se envía la página. Siempre debe tener lógica de validación de servidor para un control CustomValidator. También escribirá script de cliente (ECMAScript o JavaScript) que realizará una comprobación similar en el explorador para que el usuario tenga información inmediata.

Para utilizar un control CustomValidator con el fin de comprobar una fecha válida

  1. Desde el grupo Validación del Cuadro de herramientas, arrastre un control CustomValidator a la página y colóquelo junto al cuadro de texto textPreferredDate.

  2. Establezca las siguientes propiedades del control CustomValidator:

    Propiedad

    Ajuste

    ControlToValidate

    textPreferredDate

    Display

    Dinámico

    ErrorMessage

    Escriba una fecha en el formato m/d/aaaa.

    Text

    Formato de fecha no válido (se requiere m/d/aaaa).

    ValidationGroup

    AllValidators

  3. Haga doble clic en el control CustomValidator con objeto de crear un controlador para su evento ServerValidate y, a continuación, agregue el código resaltado que se muestra a continuación:

    Protected Sub CustomValidator1_ServerValidate( _
       ByVal source As Object, _
       ByVal args As System.Web.UI.WebControls.ServerValidateEventArgs)
       Try      DateTime.ParseExact(args.Value, "d", _         System.Globalization.DateTimeFormatInfo.InvariantInfo)      args.IsValid = True   Catch      args.IsValid = False   End Try
    End Sub
    
    protected void CustomValidator1_ServerValidate(object source, 
        ServerValidateEventArgs args)
    {
        try    {        DateTime.ParseExact(args.Value, "d",            System.Globalization.DateTimeFormatInfo.InvariantInfo);        args.IsValid = true;    }    catch    {       args.IsValid = false;    }
    }
    

    Este código se ejecuta cuando el usuario envía la página. El código interactúa con el control validador mediante el objeto ServerValidateEventArgs (args) pasado al controlador. El valor que el usuario ha especificado en el cuadro de texto textPreferredDate se pasa como la propiedad Value del objeto args. Después de haber comprobado que la entrada del usuario es válida, establezca la propiedad IsValid del objeto args en true o false. Si la establece en false, el validador mostrará su mensaje de error.

    En este ejemplo, el código utiliza un bloque try-catch para determinar si la entrada del usuario se puede convertir en un objeto DateTime. Si el usuario especifica un valor no válido (que no se ajusta a una fecha de formato m/d/aaaa), el método ParseExact del objeto DateTime produce una excepción y se ejecuta el bloque Catch.

    Nota:

    El valor del parámetro provider del método DateTime.ParseExact es independiente de la referencia cultural. Si necesita usar la referencia cultural actual, establezca el parámetro provider en null.

  4. En el controlador Button_Click, agregue el código resaltado que se muestra a continuación:

    Protected Sub buttonSubmit_Click(ByVal sender As Object, _
           ByVal e As System.EventArgs)
       If Page.IsValid Then
          labelMessage.Text = "Your reservation has been processed."
       Else     labelMessage.Text = "Page is not valid."End If
    End Sub
    
    protected void buttonSubmit_Click(object sender, EventArgs e)
    {
        if(Page.IsValid)    {
            labelMessage.Text = "Your reservation has been processed.";
        }    else    {        labelMessage.Text = "Page is not valid.";    }
    }
    

    Cuando se utiliza un control CustomValidator, debe comprobarse la propiedad Page.IsValiden cualquier procesamiento de servidor para asegurarse de que se han pasado todas las comprobaciones de validación. La propiedad IsValid devuelve el estado acumulado de todos los controles validadores en la página. Esta propiedad se utiliza para asegurarse de que todas las comprobaciones de validación han pasado el procesamiento de servidor.

Ahora ha agregado el código de servidor para el control CustomValidator para comprobar la validez de una fecha. Como ya se ha visto anteriormente en el tutorial, los controles validadores también comprueban la entrada de un usuario mediante script de cliente. También puede agregar script de cliente al control CustomValidator. En realidad, escribirá script de cliente que duplica la lógica que aplica la validación de servidor. No siempre es viable escribir código de validación personalizado de cliente (por ejemplo, si el código personalizado valida una entrada del usuario mediante consulta en una base de datos de servidor). Sin embargo, en este caso puede crear código de cliente que realice esencialmente la misma comprobación que está realizando su código de servidor.

Para agregar script de cliente al control CustomValidator

  1. Abra o cambie a Default.aspx.

  2. En el elemento <head> de la página, agregue el siguiente bloque de script de cliente:

    <script language="javascript">
    function validateDate(oSrc, args)
    {
      var iDay, iMonth, iYear;
      var arrValues;
      arrValues = args.Value.split("/");
      iMonth = arrValues[0];
      iDay = arrValues[1];
      iYear = arrValues[2];
    
      var testDate = new Date(iYear, iMonth - 1, iDay);
      if ((testDate.getDate() != iDay) ||
          (testDate.getMonth() != iMonth - 1) ||
          (testDate.getFullYear() != iYear))
      {
         args.IsValid = false;
         return;
      }
    
      return true;
    }</script>
    
    Nota:

    ECMAScript (JavaScript) distingue entre mayúsculas y minúsculas; escriba exactamente el código como se ve aquí.

    Este código es similar al de comprobación de validación de servidor, pero no tan estricto. La entrada del usuario se pasa a la función como la propiedad Value del objeto args, y se puede establecer la propiedad IsValid del objeto para indicar si el valor pasa la validación. En este ejemplo, el código comprueba que se han escrito fechas con un formato numérico válido.

    Observe que el código para la validación personalizada es ligeramente diferente en el script de cliente que en el código de servidor. ECMAScript no proporciona exactamente la misma funcionalidad que en .NET Framework. Por consiguiente, ECMAScript analiza el texto escrito en lugar del código ParseExact que se utiliza en el servidor para comprobar la fecha. Sin embargo, las dos comprobaciones de validación (cliente y servidor) son bastante parecidas para proporcionarle la funcionalidad que necesita.

  3. Coloque el punto de inserción en el elemento <asp:customvalidator> para seleccionarlo.

  4. En la ventana Propiedades, establezca la propiedad ClientValidationFunction del control como validateDate, que es el nombre de la función ECMAScript que ha creado.

    Ahora ha agregado una comprobación de validación personalizada que funciona primero en el script de cliente para comprobar la entrada del usuario inmediatamente y, después, cuando la página se envía al servidor.

Probar la validación personalizada

Ahora puede probar que su validación personalizada está funcionando correctamente.

Para probar la validación personalizada

  1. Deshabilite temporalmente la validación en el cliente; para ello, establezca la propiedad EnableClientScript del control CustomValidator en false.

  2. Presione CTRL+F5 para ejecutar la página.

  3. Especifique una dirección de correo electrónico y el número de personas de la fiesta para que la validación de esos campos sea correcta.

  4. En el cuadro de texto de la fecha, escriba una cadena que obviamente no sea una fecha y, a continuación, haga clic en el botón Submit Request.

    La página realiza una acción de ida y vuelta al servidor Web y la validación de servidor produce un error. Se produce un error en la prueba de IsValid y labelMessage indica que la página no es válida.

  5. Especifique un valor de fecha válido (como 17/11/2005) y haga clic en el botón.

    En esta ocasión, el valor de la fecha pasa la validación, por lo que ve el mensaje de confirmación creado en el controlador Click del botón.

  6. Cierre el explorador.

  7. Vuelva a habilitar la validación en el cliente; para ello, establezca nuevamente la propiedad EnableClientScript del control CustomValidator en true.

  8. Ejecute de nuevo la página y escriba valores válidos para la dirección de correo electrónico y el número de personas de la fiesta.

    Escriba un valor de fecha no válido en el cuadro de texto de la fecha y, a continuación, presione la tecla TAB. (No haga clic en el botón).

    En cuanto el cuadro de texto de fecha pierde el foco, el script de validación de cliente se ejecuta y aparece un mensaje de error.

    Nota:

    Si utiliza la función Autocompletar de Internet Explorer, al seleccionar un valor de la lista Autocompletar, se llenará el cuadro de texto con un valor, pero no se ejecutará el validador del cliente.

  9. Haga clic en el botón Submit Request.

    Dado que no se ha podido realizar la validación en el cliente para el cuadro de texto de fecha, no se envía la página.

  10. Corrija el valor de la fecha y presione de nuevo la tecla TAB.

    El mensaje de error desaparece. Ahora puede enviar el formulario.

Agregar controles opcionales con validación condicional

En la parte final del tutorial, agregará información opcional al formulario de reservas. Los usuarios pueden activar una casilla para indicar que desean confirmación telefónica de sus reservas. Si lo hacen, deben escribir su número de teléfono. Por consiguiente, la página contendrá dos controles adicionales: una casilla y un cuadro de texto.

Como en el caso anterior, utilizará la validación para comprobar las entradas del usuario. Utilizará un control RequiredFieldValidator para asegurarse de que los usuarios escriben un número de teléfono, y un control RegularExpressionValidator para comprobar el formato. El número de teléfono es opcional; sólo tiene que comprobar el número de teléfono si el usuario ha activado la casilla Confirm reservation by phone. Por lo tanto, escribirá código sencillo con el que se active o desactive la validación del número de teléfono en función del estado de la casilla.

Para agregar una validación condicional

  1. Desde el grupo Estándar del Cuadro de herramientas, arrastre un control CheckBox a la página y establezca las propiedades siguientes:

    Propiedad

    Ajuste

    ID

    checkPhoneConfirmation

    AutoPostBack

    True

    Cuando el usuario haga clic en la casilla, la página realizará una acción de ida y vuelta y habilitará o no el cuadro de texto y la validación de éste.

    CausesValidation

    False

    No se producirá automáticamente la validación al hacer clic en CheckBox.

    Text

    Confirme la reserva por teléfono.

  2. Arrastre un control TextBox a la página, bajo el control CheckBox y establezca las propiedades siguientes:

    1. Propiedad

    1. Valores de configuración

    ID

    textPhoneNumber

    Enabled

    False

    No se habilitará el cuadro de texto hasta que el usuario haga clic en la casilla.

  3. Escriba un texto como Número de teléfono: como un título junto al cuadro de texto correspondiente al número de teléfono.

  4. Desde el grupo Validación del Cuadro de herramientas, arrastre un control RequiredFieldValidator a la página y establezca las propiedades siguientes:

    Propiedad

    Ajuste

    ID

    validatorRequiredPhoneNumber

    No estableció el id. de los controles validadores anteriormente en el tutorial, pero en este caso hará referencia al control validador en código, por lo que le resultará útil proporcionarle un id. nemotécnico.

    ControlToValidate

    textPhoneNumber

    Display

    Dinámico

    ErrorMessage

    Debe proporcionar un número de teléfono.

    Text

    *

    ValidationGroup

    (Dejarlo en blanco)

    Si esta propiedad está en blanco, significa que el validador no pertenece al grupo AllValidators que estableció para los otros controles validadores en la página. Como consecuencia de ello, este validador no se comprueba de forma predeterminada cuando se hace clic en el control buttonSubmit.

  5. Arrastre un control RegularExpressionValidator a la página y establezca las propiedades siguientes:

    Propiedad

    Ajuste

    ID

    validatorRegExPhoneNumber

    ControlToValidate

    textPhoneNumber

    Display

    Dinámico

    ErrorMessage

    El formato del número de teléfono no es válido

    Text

    Formato no válido

    ValidationExpression

    (Use el cuadro de diálogo Editor de expresiones regulares para seleccionar Número de teléfono en EE.UU. u otra expresión para el número de teléfono).

    ValidationGroup

    (Dejarlo en blanco)

  6. Haga doble clic en el control checkPhoneConfirmation con objeto de crear un controlador para su evento CheckedChanged y, a continuación, agregue el código resaltado que se muestra a continuación:

    Protected Sub checkPhoneConfirmation_CheckedChanged( _
       ByVal sender As Object, _
       ByVal e As System.EventArgs)
       If checkPhoneConfirmation.Checked = True Then      textPhoneNumber.Enabled = True      validatorRequiredPhoneNumber.ValidationGroup = "AllValidators"      validatorRegExPhoneNumber.ValidationGroup = "AllValidators"   Else      textPhoneNumber.Enabled = False      validatorRequiredPhoneNumber.ValidationGroup = ""      validatorRegExPhoneNumber.ValidationGroup = ""   End If
    End Sub
    
    protected void checkPhoneConfirmation_CheckedChanged(
        object sender, EventArgs e)
    {
        if(checkPhoneConfirmation.Checked)    {        textPhoneNumber.Enabled = true;        validatorRequiredPhoneNumber.ValidationGroup =             "AllValidators";        validatorRegExPhoneNumber.ValidationGroup = "AllValidators";    }    else    {        textPhoneNumber.Enabled = false;        validatorRequiredPhoneNumber.ValidationGroup = "";        validatorRegExPhoneNumber.ValidationGroup = "";    }
    }
    

    Cuando el usuario hace clic en la casilla, los dos controles validadores asociados al cuadro de texto se agregan al grupo de validación al que pertenecen los otros controles validadores. El efecto es que todos los validadores de la página, incluidos los del número de teléfono, se comprobarán cuando el usuario envíe la página. Si el usuario desactiva la casilla, los validadores se quitan del grupo y, por lo tanto, no se procesan cuando se hace clic en el botón Enviar solicitud.

Probar la validación condicional

Ahora puede probar si esa validación condicional funciona correctamente.

Para probar la validación condicional

  1. Presione CTRL+F5 para ejecutar la página.

  2. Escriba información válida para la dirección de correo electrónico, el número de personas de la fiesta y la fecha.

  3. Haga clic en Enviar solicitud.

    Se envía la página y aparece el mensaje de confirmación.

  4. Active la casilla Confirmar la reserva por teléfono.

  5. Haga clic de nuevo en Enviar solicitud.

    En esta ocasión, verá un mensaje de error (una estrella junto al cuadro de texto correspondiente al teléfono). Al hacer clic en la casilla, habilitó la validación para el cuadro de texto.

  6. Escriba un número de teléfono no válido y, a continuación, haga clic de nuevo en Submit Request para confirmar que el cuadro de texto no aceptará un número de teléfono no válido.

  7. Escriba un número de teléfono con un formato correcto y haga clic en el botón de envío para confirmar que el control validador acepta datos con un formato correcto.

    Nota:

    Si ha seleccionado Número de teléfono de EE.UU.en el Editor de expresiones regulares para la propiedad ValidationExpression del control RegularExpressionValidator, un número de teléfono con el formato correcto consta del código de área (campo opcional con 3 caracteres numéricos entre paréntesis o seguidos de un guión), seguido de un conjunto de 3 caracteres numéricos, un guión y, finalmente, un conjunto de 4 caracteres numéricos. Ejemplos válidos son (425) 555-0123, 425-555-0123 ó 555-0123.

Pasos siguientes

La validación que agregó a la página de formularios Web Forms explica los conceptos básicos de los controles de validación Web.

Un aspecto importante de la validación consiste en comprender cómo ayuda a aumentar la seguridad para un sitio Web. Para obtener información detallada, vea Información general sobre las amenazas para la seguridad de las aplicaciones Web.

Vea también

Conceptos

Información general sobre los ataques mediante secuencias de comandos

Referencia

Validar la información especificada por el usuario en páginas Web ASP.NET