Skip to content

Instantly share code, notes, and snippets.

@codehakase
Last active March 13, 2018 20:12
Show Gist options
  • Save codehakase/f443ec722e85e5afbdd9d1dafb844832 to your computer and use it in GitHub Desktop.
Save codehakase/f443ec722e85e5afbdd9d1dafb844832 to your computer and use it in GitHub Desktop.
// questions is a map of questions
let questions = [
{
question: "Care for Some Lorem Ipsum?",
options: [
"yes",
"maybe",
"I don't mind"
],
correct_option: "I don't mind"
}
];
// using the questions map, to populate the view
let questionsHtml = document.getElementById("questions-holder");
// question here, is a html wrapper for each question
let question;
// displayOptions recieves the options array, and returns a div with radio buttons of the options
let displayOptions = (_option) => {
return (`
<div class="radio">
<label>
<input type="radio" class="input1" value="${_option}" name="self-test">
${_option}
</label>
</div>
`);
}
// populate, renders the view with each questions, and options from the map
let populate = () => {
// loop through the questions map
for (let i = 1; i < questions.lenghth; i++) {
question = `
<div>
<p><strong>${i}. ${questions[i].question}.</strong></p>
${questions[i].options.map(displayOptions).join("")}
</div>
`;
questonsHtml.innerHTML += question;
}
}
// populate the view once the window loads
window.onload = populate();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment