Actividad autonoma 8 de julio de 2015 - Erick lozada
1. UNIANDES BABAHOYO
ACTIVIDADES AUTONOMAS
Babahoyo, juliode 2015
Asignatura: Programación WebI
Docente:Lcda. JulietaCampi Mayorga, Ms.
Fecha de presentaciónmediante el Blog : 15 de juliode 2015
AlumnoErick 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 ysu formato tiene que ser correcto; por ejemplo,
alguien@ejemplo.com.(Porlo general,noes viable comprobar si la dirección de correo electrónico
2. 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 condicional
1. 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 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 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
3. 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"
4. validatorRegExPhoneNumber.ValidationGroup = "AllValidators"
Else
textPhoneNumber.Enabled = False
validatorRequiredPhoneNumber.ValidationGroup = ""
validatorRegExPhoneNumber.ValidationGroup = ""
End If
End Sub
RESULTADOS
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 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.
5. RESULTADO
Codificació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">
<!--
#menu{
position:fixed;
font-family:verdana,arial;
font-size:15pt;
color:white;
//text-align:center;
padding: 2px 2px 2px 2px; /* margen con valores: arriba - derecha - abajo - izquierda */
top: 0px; /* Distancia hasta el borde superior */
left: 0px; /* Distancia hasta el borde izquierdo */
width:100%;
background-color: #178BB9;
z-index: 1; /* hace que la capa sea opaca */
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
border: 2px solid #DBE1EB;
}
-->
</style>
</head>
<body>
<div id="menu">
<center><h1>Registro de habitaciones</h1>
<h2> Hotel Uniandes </h2></center><br/></div></center>
<br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br />
<form id="form1" runat="server">
<div>
<p><b>Cedula:</b></p>
<p><asp:TextBox ID="TxtCedula" runat ="server" MaxLength="10"></asp:TextBox> <b>
<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>
</b> </p>
6. <br/>
<p><b>Nombres:</b></p>
<p><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>
</p><br/>
<p><b>Numero de huespedes:</b></p>
<p><asp:TextBox ID="TxtNumero_personas" runat="server" ></asp:TextBox><b>
<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>
</b></p><br />
<p><b>Correo electronico:</b></p>
<p><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>
</p><br />
<p><b>Telefono:</b></p>
<p><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>
</p> <br />
<p><b>Fecha de ingreso:</b></p>
<p><b><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>
</b><br />
<p><asp:Button Id="BtnConfirmar" runat ="server" Text ="Enviar solicitud" /><asp:Label
ID="Etiqueta" runat="server" Text=""></asp:Label></p>
</div>
<asp:ValidationSummary ID="ValidationLista" runat="server" ShowMessageBox="True" />
</form>
</body>
</html>
7. 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