IST Khipu

Primer examen del curso de titulacin

Carrera Profesional Asignatura Examen Docente Preguntas Computacin e Informtica PHP/Ajax Primero Dennys Ordoez 03

Contenido
Este examen consiste de 3 preguntas cuyas puntuaciones se ven detalladas a continuacin: Pregunta Pregunta 1 Pregunta 2 Pregunta 3 Total Puntuacin 06 Puntos 08 Puntos 06 Puntos 20 Puntos

Cuadro 1: Puntos asignados a cada pregunta

Objetivos
En el presente examen se busca evaluar los siguientes contenidos que han sido desarrollados durante el transcurso de la asignatura: 1. Fundamentos bsicos de programacin 2. Conocimiento bsico de la sintaxis y funcionamiento de Javascript 3. Conocimiento bsico de jQuery 4. Conocimiento de HTML DOM 5. Conocimiento de Eventos 6. Dominio en el manejo de archivos XML 7. Fundamentos bsicos de AJAX 8. Fundamentos bsicos de HTML 5

1.
1.1.

Pregunta 1 (06 puntos)

Objetivos

En esta pregunta se busca evaluar el manejo bsico de javascript as como los conocimientos elementales asi como el uso fundamental de jQuery, adems control de eventos de controles

1.2.

Planteamiento

Se tiene una tabla conteniendo dos inputs, en el primero de ellos debe ingresarse un valor numrico que representa la temperatura en grados centgrados, en la lista desplegable se debe escoger a que escala dicha temperatura ha de ser convertida, los valores posibles son: Farenheit, Kelvin y Rankine. Al pulsar el botn calcular el valor convertido debe ser mostrado en el segundo input, el cual, slo es de lectura y slo puede ser modicado mediante cdigo javascript.

1.3.

Pasos a realizar

Crear el cdigo correspondiente en javascript, as como las etiquetas necesarias para poder realizar dicha conversin a la escala deseada, debe usar jQuery para realizar esta tarea.

1.4.

Observaciones

Debe aadir manualmente la etiqueta script con src=jquery.js para poder usar jquery tal como se ha visto en clases.

2.
2.1.

Pregunta 2 (08 puntos)

Objetivos

En esta pregunta se busca evaluar el control de eventos, uso de ajax mediante jQuery y conocimiento de HTML DOM

2.2.

Planteamiento

1. Se tiene una pgina llamada index.html conteniendo un men formado por hipervnculos y etiquetas li, una de estos items es listado de clientes, al hacer click en l debe cargarse el contenido del archivo cliente.html en el div llamado cuerpo, todo esto debe hacerse usando jQuery y las funciones ajax correspondientes. 2. El archivo cliente.html contiene un control de seleccin conteniendo nombres de clientes, al seleccionar uno de ellos y pulsar el botn Detalles, los datos de los clientes tales como Cdigo, Nombre, Apellidos, Pgina Web, Direccin y fotografa deben ser cargados en los inputs de informacin del cliente, estos datos deben ser ledos del archivo clientes.xml 3. As mismo en la tabla identicada como Informacin del Cliente existe el botn Agregar a la lista, al hacer click sobre este botn los datos contenidos, en los controles anteriores son aadidos como una

nueva la a la tabla inferior, es decir, el cdigo, nombre y apellidos, direccin web y direccin deben agregarse a la tabla. 4. Ntese que en el caso de la direccin web sta debe ser aadida como un hipervnculo y no simplemente como un texto. Un ejemplo del resultado nal puede verse a continuacin:

Figura 1: Pgina de clientes conteniendo informacin de los mismos

2.3.

Pasos a realizar

Crear el cdigo correspondiente en javascript, parar realizar todas estas acciones, as como modicar las etiquetas html que considere necesario para conseguir el objetivo.

3.
3.1.

Pregunta 3 (06 puntos)

Objetivos

En esta pregunta se busca evaluar el control de eventos, uso de ajax mediante jQuery, conocimiento de HTML DOM y el uso de la etiqueta Canvas que es parte de la implementacin HTML 5

3.2.

Planteamiento

1. Se tiene una pgina llamada index.html conteniendo un men formado por hipervnculos y etiquetas li, uno de estos items es Reportes, al hacer click en l debe cargarse el contenido del archivo estadistica.html en el div llamado cuerpo, todo esto debe hacerse usando jQuery y las funciones ajax correspondientes. 2. El archivo estadistica.html contiene un control de seleccin conteniendo aos desde el 2008 al 2011, al seleccionar uno de ellos los balances del ao seleccionado (los cuales estn por trimestres) deben ser cargados en los inputs correspondientes, as como el ao al que representan. 3. Al mismo tiempo debe gracarse un sistema de barras verticales en el canvas que representen dichos valores, estas barras debern tener diferentes colores para cada trimestre, la altura de las barrass debe ser directamente proporcional al valor del trimestre que representan.

4. As mismo debe escribirse los valores nmericos junto con las barras, este valor puede escribirse encima, debajo o a un costado de la barra procurando siempre que su posicin identique correctamente a la barra, puesto que durante el desarrollo de las sesiones no se ha hecho esto se muestra a continuacin un ejemplo. 1 <canvas id="dibujo" width="300" height="300"> 2 <script type="text/javascript"> 3 //obtener el canvas 4 var canvas = document . getElementById ( "dibujo" ) ; 5 //obtener el contexto 6 var contexto = canvas . getContext ( "2d" ) ; 7 //escribir un texto en el canvas en la posicin 20, 40 8 contexto . f i l l T e x t ( "Escribiendo en HTML 5" , 20, 40) ; 9 </script> Listado 1: Ejemplo de uso de llText

Un ejemplo del resultado nal puede verse a continuacin:

Figura 2: Reporte mediante diagrama de barras

3.3.

Pasos a realizar

Crear el cdigo correspondiente en javascript, parar realizar todas estas acciones, as como modicar las etiquetas html que considere necesario para conseguir el objetivo.