Las actividades de preguntas con respuestas en cuadros de entrada (PIB) permiten introducir una pregunta con un cuadro
de entrada en el que se debe introducir la respuesta. Una misma pregunta admite más de un cuadro (box) de entrada que debe rellenar el
usuario. Cada cuadro puede ser de tipo texto o numérico según el tipo de respuesta que se espera. Las respuestas serán comprobadas de
forma distinta según como sea el tipo de cuadro. Según si se acierta o no la pregunta se mostrará un u otro contenido. Este contenido deberá ser creado
para ofrecer la información que se crea debe conocer el usuario.
Puede un ejemplo con el resultado de las opciones escogidas en esta sección de la página .
También puede ver ejemplos de ejercicios al final de la página , algunos con más de un cuadro de entrada.
Este formulario ayuda a generar el código para crear este tipo de actividades educativas utilizando la biblioteca jsGeork. Después pulsar en el botón 'Genera '
se creará el código html+javascript que deberá copiar y pegar en su página. Una vez haya pegado el código podrá modificar fácilmente
la parte de código html con el contenido que verán los usuarios.
Opciones de respuesta:
Los siguientes campos sirven para especificar en una respuesta qué tipo de entrada (cadena o número) se espera del usuario y controlar el
comportamiento del cuadro de entrada o box . Una misma pregunta puede tener más de un cuadro (box) de entrada. Cada cuadro
tendrá sus valores y al pulsar en el botón para comprobar las respuestas se evaluarán no a uno. Editando el código puede introducir
un número ilimitado de boxs que formarán parte de la misma pregunta.
Box 1:
Tipo de cuadro:
Texto
Numérico
Solución:
El cuadro de entrada (inputbox) espera del usuario una entrada de texto o alphanumérica.
En el campo 'Solución ' puede introducir
la respuesta esperada por el usuario. El valor se colocará en el código html y será sustituido por el cuadro de entrada, pero
puede dejarlo en blanco y colocar las respuestas aceptadas en los campos values .
El cuadro de entrada (inputbox) espera del usuario una entrada numérica.
Para comprobar que la respuesta introducida es correcta se harán varias comparaciones. Primero se mirará si el número introducido se corresponde
con el campo 'Solución '; después si se corresponde con alguno de los valores de los campos values . Si se han llenado los campos
min y max se mirará si el número introducido se encuentra entre estos dos valores. Finalmente si está dentro del margen de error
introducido en el campo accuracy .
box:
Nombre del box o cuadro de entrada. Evite utilizar espacios en blanco.
values:
Además del valor existente en el html puede añadir otros valores considerados como válidos para resolver el cuadro.
placeholder:
Permite introducir el texto a modo de ayuda que aparecerá en gris dentro del cuadro, siempre que el navegador acepte este
característica de html5.
weight:
El peso del cuadro respecto a otros cuadros que pueda tener la pregunta.
autocomplete:
on
off
Activa/desactiva en el cuadro el comportamiento de mostrar en una lista desplegable los valores que anteriormente se puedan haber introducido.
adjustgaps:
none
all
size
maxlength
Ajusta el tamaño del cuadro a la longitud de la(s) respuesta(s) (size), limita el número de caracteres que se pueden entrar (maxlength), o ambas cosas (all). En todos los
casos se limitará a la longitud de la respuesta menos restrictiva, es decir la más larga. En las preguntas numéricas no conviene restringir el número de caracteres que se
pueden entrar.
aria-label:
Texto del atributo aria-label=""
de la especificación WAI-ARIA. El atributo se colocará en el cuadro de texto y proporcionará información
adicional a los usuarios que utilicen tecnologías de apoyo. Si deja el valor vacío no se incluirá la propiedad en el código y por tanto se utilizará
el valor predeterminado, es decir, se colocará el atributo aria-label="Introduzca un valor en el cuadro de entrada"
. Al tratarse del valor
de un atributo html evite introducir caracteres no válidos como < y >.
Este formulario permite crear un cuadro de entrada (o box) por pregunta, sin embargo no hay límite en el número de cuadros que
puede tener una pregunta. Puede añadir más cuadros manualmente. Solo debe saber que el script para una pregunta determinada
buscará dentro de los bloques del documento que tengan el atributo data-makeqs="" con el valor igual al id de la actividad y creará
cuadros en aquellos bloques del código html que tengan el atributo data-input-make="" . El valor de este atributo es el nombre del box,
es decir del nombre la propiedad del objeto boxs que contiene la configuración de ese cuadro. Puede añadir en el código JavaScript más objetos boxs para
tener más cuadros en la misma pregunta. El procedimiento recomendado es:
Crea con el formulario una pregunta con un cuadro. Copia y pega el código en su página.
Utiliza el formulario para crear una nueva pregunta variando el nombre del campo box
, p. ej. box2 (y evidentemente los otros campos que necesite).
Copia solamente el código del objeto box (p. ej. "box2": { ... }) y lo pega en su documento detrás del objeto box existente. No olvide incluir la coma al final del primer objeto, detrás de }.
En el código html debe añadir el bloque con atributo data-input-make=""
y valor igual al nombre del box para que se cree el cuadro (p. ej. data-input-make="box2"). Deberá estar dentro de un bloque con atributo data-makeqs=""
y valor igual al id de la pregunta.
Además de los campos que incluye el formulario anterior existen otras opciones que puede utilizar. Naturalmente puede modificar las opciones
editando directamente el código con las propiedades del objeto, pero entonces deberá tener cuidado de que el código javascript no contenga errores.
icons:
csshexent
Seleccionando 'csshexent' se utilizarán entidades css hexadecimales para añadir iconos.
storage:
local
session
Indica si debe utilizarse el HTML5 Web Storage para guardar si la actividad ha sido realizada. Si el navegador
soporta el Web Storage, se guardará en el storage la fecha de la primera y última ocasión en el que el usuario
responda la actividad. Cuando se recargue el documento se mostrará una tabla mostrando las fechas y puntuaciones.
NOTA DE ACLARACIÓN
Sobre las puntuaciones : Cada actividad es puntuada internamente de 0 a 100 aunque esta puntuación solo es utilizada cuando la actividad
forma parte de un Test. En principio se considera a una actividad como realizada correctamente cuando se obtiene una puntuación o score de 100. En este
caso se guarda en el storage la primera y última vez que se ha realizado correctamente la actividad y se lanza, si está definido, el evento onok
.
En caso contrario se lanza el evento onko
. Si lo necesita pude cambiar el umbral de considerar la actividad como correcta utilizando la propiedad
"threshold ". Por ejemplo, añadiendo al objeto la línea "threshold": 50,
hará que se considere como correcta la actividad obteniendo un score de 50 o más.
En las actividades de preguntas con respuestas en cuadros de entrada (PIB) la puntuación obtenida es el porcentaje de cuadros de entrada respuestos correctamente sobre el total de cuadros de entrada pero teniendo en cuenta el peso (weight ) de cada cuadro.
Sobre las variables públicas : Las variables this.score, this.attempts, etc.
son variables públicas de la función jsGeork.Questions.Question()
. Por tanto, la palabra reservada
this se refiere a esta función y podemos acceder a estas variables utilizando jsGeork.Questions.Question.score, jsGeork.Questions.Question.attempts, etc
.
Debe tener en cuenta que si la función es llamada por otras actividades el valor de estas variables será sobrescrito. Por tanto debe utilizarlas
inmediatamente después de su llamada por la actividad. Desde los eventos onready, oncheck, onok y onko
es segura su utilización ya que su llamada actualiza
su valor al de la actividad; sin embargo, si leemos el valor de jsGeork.Questions.Question.attempts
obtendremos el de la última actividad que los ha actualizado.
Puede saber el id de la última actividad que ha actualizado las variables utilizando jsGeork.Questions.Question.update
. Si necesita acceder a estos datos desde fuera
de los eventos utilice la propiedad de la función cuyo nombre es el del id de la actividad, por ejemplo jsGeork.Questions.Question["id"]
. Esta propiedad, después de que la actividad sea chequeada,
contiene como valor un objeto con los datos de la actividad. Puede ver en la consola de su navegador qué datos guarda este objeto con el script console.log(jsGeork.Questions.Question["id"]);
.