Practica 2 Web Dinamico

Programación de Web Dinámico
DG01T-19O
Dr. Wulfrano Arturo Luna Ramírez
Práctica 2
Realizar los siguientes ejercicios y subirlos a la plataforma Ubicua nombrados
con el siguiente formato: aPaternoAmaterno-WD-Pr1.* No se revisarán
archivos que no cumplan con esto
1. Crear una página HTML para representar la siguiente Ficha de Estudiante:
2. Añadir una hoja de estilo vinculada (estiloFormulario.css) para

controlar, tipos de letras, colores, y fondo (de página, del texto y de las celdas)
en la Ficha de Estudiante.
3. Añadir código JavaScript vinculado (formulario.js) para controlar la

apariencia y generar los siguientes comportamientos:
DG01T-19O
3.0 Usando el evento onload en el <body>, mostrar una ventana de

bienvenida al usuario vía la función apariencia(n), donde n indica
aleatoriamente un número de mensaje a ser mostrado, donde n={1,…,5}
3.1 Añadir un boton “Apariencia” que invoque las funciones siguientes.
3.1.1 apariencia(), para realizar lo que sigue:
a) Añadir colores de fondo en campos de texto y color de fondo en
tablas y celdas.
b) Numerar los campos (Lenguajes de programación sólo cuenta
como un elemento)
3.1.2 marcaRequeridos(), para realizar lo siguiente:
a) Señalar los campos requeridos (puede ser sólo con un asterisco
en un color distinto al resto del texto): Nombre, apellidos, grupo, materia,
lenguajes de programación y bases de datos.
b) Insertar información por omisión en los campos de texto (“Ingresa
el X”), donde X se refiere a la información correspondiente, y en el área de
texto: “Ingresa aquí una breve reseña de tus conocimientos”.
c) El estilo de los textos por omisión debe ser distinto, en un tono
más bajo que el del texto original, y borrarse en cuanto el usuario ingrese sus
datos (simulando el placeholder).
3.2 Añadir funcionalidad al botón de envío mediante la función
validaFormulario(), para realizar lo siguiente:
a) Validar que los campos requeridos sean llenados.
b) Validar que en la reseña no haya “malas palabras”, definiendo
para ello, un diccionario de malas palabras y sus reemplazos sugeridos.
c) En caso de haberlas, generar una versión del texto substituyendo
las “malas palabras” por un remplazo sugerido.
d) Mostrar un vínculo o botón para que el usuario acepte la
sugerencia, en su defecto, el usuario puede editar la información.
3.3 Tras validar la información del usuario, mostrarle el formulario lleno
con sus datos, pero sin posibilidad de edición (usando el atributo “disabled” de
los campos de texto, a través de una función llamada desactivaEdicion()),
mostrando además:
3.3.1 Un botón llamado “Editar de nuevo” que invoque a la función
activaEdicion(), para activar la edición del formulario y volver a ingresar
DG01T-19O
datos (con lo que se debe validar de nuevo, es como un reinicio del proceso de
captura de datos – tal como en el punto 3.2).
3.3.2 Un botón llamado “Aceptar”, para continuar con el procesamiento del
formulario.
4. Una vez que el usuario acepta seguir el procesamiento del formulario,

invocar a un archivo llamado procesa.php, que realice lo siguiente:
Inserte los datos en un archivo de texto llamado datosUsuario.dat,
siguiendo el formato:
campo1:valor...campoN:valor\n
Donde “campo” es el nombre de su respectivo campo de texto en el
formulario, y “valor” es la información proporcionada por cada usuario y \n es
un cambio de línea para almacenar la información de cada usuario en un
renglón separado.
5. Generar un archivo llamado verDatos.php para mostrar el contenido del

archivo datosUsuario.dat, para desplegarlos en una tabla, separando cada
dato por celdas, de la siguiente forma:
6. Se debe utilizar una hoja de estilo (admin.css) para controlar la apariencia

de la presentación de los datos de los usuarios.

Practica 2 Web Dinamico

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Practica 2 Web Dinamico

Cargado por

Copyright:

Formatos disponibles

Programación de Web Dinámico

1. Crear una página HTML para representar la siguiente Ficha de Estudiante:

2. Añadir una hoja de estilo vinculada (estiloFormulario.css) para

3. Añadir código JavaScript vinculado (formulario.js) para controlar la

3.0 Usando el evento onload en el <body>, mostrar una ventana de

4. Una vez que el usuario acepta seguir el procesamiento del formulario,

5. Generar un archivo llamado verDatos.php para mostrar el contenido del

6. Se debe utilizar una hoja de estilo (admin.css) para controlar la apariencia

También podría gustarte