Actividad autonoma 8 de julio de 2015 - Erick lozada

UNIANDES BABAHOYO

ACTIVIDADES AUTONOMAS

Babahoyo, julio de 2015

Asignatura: Programación Web I

Docente: Lcda. Julieta Campi Mayorga, Ms.

Fecha de presentación mediante el Blog : 15 de julio de 2015

Alumno Erick Lozada

1.- Realizar una aplicación Web que permita ingresar los valores de reserva de una habitación del Hotel UNIANDES – BABAHOYO.

Deberá Aplicar los siguientes controles

Control

TextBox

TextBox

TextBox

Button

Label

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, [email protected]. (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. Comprobar la fecha ingresada

2.- Realice la siguiente práctica.

FORMULARIO DE RESERVAS DEL HOTEL UNIANDES-BABAHOYO

Agregar controles opcionales con validación condicional

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.

Utilizará la validación para comprobar las entradas del usuario.

- control RequiredFieldValidator para asegurarse de que los usuarios escriben un número

de teléfono, y un controlRegularExpressionValidator 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 condicional1. Use un control CheckBox a la página, sobre el botón Enviar solicitud, presione ENTRAR

para crear una línea vacía debajo de él y establezca las propiedades siguientes:

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

a. Propiedad b. Valores

ID textPhoneNumber

Enabled FalseNo 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 RequiredFieldValidator a la página junto al cuadro de texto de número de teléfono y establezca las siguientes propiedades:

Propiedad Configuración

ID validatorRequiredPhoneNumber

ControlToValidate

textPhoneNumber

Display Dinámico

ErrorMessage Debe proporcionar un número de teléfono.

Text *

ValidationGroup (Dejarlo en blanco)

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

Propiedad Configuración

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 de 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, tal y como se muestra en el siguiente ejemplo:

VB

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 IfEnd Sub

RESULTADOSCuando 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 la información correspondiente a la dirección de correo electrónico, el

número de personas que hay en 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 :

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.

RESULTADOCodificación (Ejercicio 1 y 2)

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebFormRegisto.aspx.vb" Inherits="RESERVAS_DE_UNA_HABITACION_UNIANDES.WebFormRegisto" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title>

<style type="text/css"> </style> </head><body> <div id="menu"> <center><h1>Registro de habitaciones</h1><h2> Hotel Uniandes </h2></center> </div></center> <form id="form1" runat="server"> <div> Cedula: <asp:TextBox ID="TxtCedula" runat ="server" MaxLength="10"></asp:TextBox>

<asp:RequiredFieldValidator ID="rfvCedula" runat="server" Display="Dynamic" ErrorMessage="Falta de ingresar el nombre" ControlToValidate="TxtCedula">*</asp:RequiredFieldValidator> <asp:RangeValidator ID="rvCedula" runat="server" Display="Dynamic" MaximumValue="10" ErrorMessage="El numero de cedula es de 10 digitos" ControlToValidate="TxtCedula">*</asp:RangeValidator> Nombres: <asp:TextBox ID="TxtNombres" runat ="server" MaxLength="50"></asp:TextBox> <asp:RequiredFieldValidator ID="rfvNombre" runat="server" Display="Dynamic" ErrorMessage="Ingrese el nombre responsable" ControlToValidate="TxtNombres">*</asp:RequiredFieldValidator> Numero de huespedes: <asp:TextBox ID="TxtNumero_personas" runat="server" ></asp:TextBox> <asp:RangeValidator ID="rgPersonas" runat="server" Display="Dynamic" MaximumValue ="7" MinimumValue="2" ErrorMessage="Debe hospedarse maximo 7 personas o 2 como minimo" ControlToValidate="TxtNumero_personas">*</asp:RangeValidator> Correo electronico: <asp:TextBox ID="TxtCorreo_Electronico" runat="server" ></asp:TextBox> <asp:RequiredFieldValidator ID="rfCorreo" runat="server" Display="Dynamic" ErrorMessage="Falta el ingreso del correo" ControlToValidate="TxtCorreo_Electronico">*</asp:RequiredFieldValidator> <asp:RegularExpressionValidator ID="revCorreo" runat="server" ErrorMessage="Formato de correo no valido" ControlToValidate="TxtCorreo_Electronico" ValidationExpression="\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">**</asp:RegularExpressionValidator> Telefono: <asp:TextBox ID="TxtTelephoneNumber" runat="server" Enabled="False" ></asp:TextBox> <asp:CheckBox ID="CheckBoxPhoneConfirmation" runat ="server" Text="Opcional" /> <asp:RequiredFieldValidator ID="rfvPhoneNumber" runat="server" ControlToValidate="TxtTelephoneNumber" Display="Dynamic" ErrorMessage="Debe proporcionar un numero telefonico">*</asp:RequiredFieldValidator> <asp:RegularExpressionValidator ID="RegularExValidatorPhoneNumber" runat="server" ErrorMessage="El formato del numero de telefono no es valido" ValidationExpression="((\(\d{3}\) ?)|(\d{3}-))?\d{3}-\d{4}" ControlToValidate="TxtTelephoneNumber" Display="Dynamic">Formato no valido</asp:RegularExpressionValidator> 

Fecha de ingreso: <asp:TextBox ID="TxtFecha" runat="server" ></asp:TextBox> <asp:CompareValidator ID="cvFecha" runat="server" ControlToValidate="TxtFecha" Display="Dynamic" ErrorMessage="Fecha incorrecta, debe ser antes de la fecha actual" Operator="LessThan" Type="Date">*</asp:CompareValidator> <asp:Button Id="BtnConfirmar" runat ="server" Text ="Enviar solicitud" /><asp:Label ID="Etiqueta" runat="server" Text=""></asp:Label>

</div> <asp:ValidationSummary ID="ValidationLista" runat="server" ShowMessageBox="True" /> </form></body>

</html>

Public Class WebFormRegisto Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load If Not Page.IsPostBack Then cvFecha.ValueToCompare = Today End If End Sub Protected Sub CheckBox_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBoxPhoneConfirmation.CheckedChanged If CheckBoxPhoneConfirmation.Checked = True Then TxtTelephoneNumber.Enabled = True rfvPhoneNumber.ValidationGroup = "AllValidators" RegularExValidatorPhoneNumber.ValidationGroup = "AllValidators" Else TxtTelephoneNumber.Enabled = False rfvPhoneNumber.ValidationGroup = "" RegularExValidatorPhoneNumber.ValidationGroup = "" End If End Sub End Class

Capturas de pantalla

Actividad autonoma 8 de julio de 2015 - Erick lozada

Devices & Hardware

Transcript of Actividad autonoma 8 de julio de 2015 - Erick lozada