Crea una encuesta en 3 pasos con HTML y PHP

Muchas veces es necesario incluir alguna encuesta en nuestro blog o sitio web. Algo básico, con algunas preguntas multiple choice, un botón para enviar y un sistema que gradúe las respuestas y te diga cuáles son los resultados.

Esto es un trabajo sencillo de realizar con PHP, por lo que es un buen comienzo para aquellas personas que están incursionando en la teoría básica de construir formularios en HTML y el manejo de información de otros sitios con PHP.

Las preguntas de la encuesta se encuentran envueltas en un formulario:

… las preguntas van aquí …

Los formularios, por lo general, poseen botones para enviar la información, y éste no es la excepción. Al hacer clic en el botón de “Enviar“, posteará la información de cada entrada del formulario en la URL que hayamos colocado en el campo “action“.

Los cuestionarios son esencialmente listas de preguntas, por lo que una lista ordenada funcionará. Cada pregunta individual luciría algo así:

CSS Stands for…

A) Computer Styled Sections

B) Cascading Style Sheets

C) Crazy Solid Shapes

D) None of the above

Noten que aquí hace cuatro entradas, pero todas tienen “radio” en el campo de “type“, y en “name“, el mismo nombre, idéntico.

Básicamente actúan como una entrada singular, porque sólo una de ellas puede ser seleccionada a la vez y la información se postea como un valor singular.

Al final de todo, nuestro botón de “enviar“:

En nuestro archivo grade.php, necesitamos tomar los valores que han sido posteados, luego chequearemos cada uno de ellos e incrementaremos el número correcto, y finalmente mostraremos un div con el número de respuestas correctas.

$answer1 = $_POST['question-1-answers'];

$answer2 = $_POST['question-2-answers'];

$answer3 = $_POST['question-3-answers'];

$answer4 = $_POST['question-4-answers'];

$answer5 = $_POST['question-5-answers'];

$totalCorrect = 0;

if ($answer1 == “B”) { $totalCorrect++; }

if ($answer2 == “A”) { $totalCorrect++; }

if ($answer3 == “C”) { $totalCorrect++; }

if ($answer4 == “D”) { $totalCorrect++; }

if ($answer5) { $totalCorrect++; }

echo “

$totalCorrect / 5 correct

”;

?>

Fuente: CSS Tricks