...
PDA

fill-in-the-blank quiz

lm111
09-02-2011, 07:49 PM
Does anyone know how I can modify the code below to show a question that has more then one fill in the blank? For example:
_____ is an attitude or behavior which leads another to do ________.

Thank you.




<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">

var question_type=new Array(4)
question_type[0]="mult";
question_type[1]="mult";
question_type[2]="blank";
question_type[3]="blank";


var questions=new Array(4)
questions[0]="The words used to <u>describe</u> the manifestation of Jesus as Messiah of Israel, Son of God and Savior of the world are ...";
questions[1]="Which of these is not a symbol of the Holy Spirit?";
questions[2]="Human life must be respected and protected absolutely from the moment of ______.";
questions[3]="_____ is an attitude or behavior which leads another to do evil.";


var answers = new Array(4)
answers[0]= "B"; //The Epiphany
answers[1]= "C"; //Sunshine [water, fire, anointing]
answers[2]="conception";
answers[3]="scandal";


var each_question = new Array(3)

each_question[0]="<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>"
+ questions[0] + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%'>" + "&nbsp;" + "</td>" + "<td>" + "&nbsp;" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='A'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The creed" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='B'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The Epiphany" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='C'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The magisterium" + "</font>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='D'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The Annunciation" + "</font>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "&nbsp;" + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>";

each_question[1]="<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>"
+ questions[1] + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%'>" + "&nbsp;" + "</td>" + "<td>" + "&nbsp;" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='A'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Water" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='B'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Fire" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='C'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Sunshine" + "</font>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='D'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Anointing" + "</font>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "&nbsp;" + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>";


each_question[2] = "<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>"
+ questions[2] + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%'>" + "&nbsp;" + "</td>" + "<td>" + "&nbsp;" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='text' name='text_field'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "&nbsp;" + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>";

each_question[3] = "<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>"
+ questions[3] + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%'>" + "&nbsp;" + "</td>" + "<td>" + "&nbsp;" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='text' name='text_field'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "&nbsp;" + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>";



var currentQuestion=0;
var score=0;

function writeEachQuestion() {
if(currentQuestion==0){
top.bottom_right.document.open();
top.bottom_right.document.write("<center>" + "<h3>" + "<font face='arial, helvetica, verdana'>" + "Go get 'em," + " " + userName + "!" + "<br>" + "</h3>" +
"Let's see how well" + "<br>" + "you know your faith!" + "</center>" + "</font>");
top.bottom_left.document.write(each_question[currentQuestion]);
} else {
top.bottom_left.document.write(each_question[currentQuestion]);
top.bottom_right.document.open();
}
}

function swapper() {
top.bottom_left.document.fish_first.src="next2.gif";
}

function unswapper() {
top.bottom_left.document.fish_first.src="next.gif";
}

function checkQuestionType() {
if (question_type[currentQuestion-1]=="mult"){
multChecker();
} else if (question_type[currentQuestion-1]=="blank") {
textChecker();
}
}

function multChecker() {
var answerValue=answers[currentQuestion-1];
var checkedIndex = -1;
for(i=0; i < top.bottom_left.document.quiz_questions.choice.length; i++) {
//if a radio button is checked, the variable checkedIndex is set to the value of that index number.
if(top.bottom_left.document.quiz_questions.choice[i].checked){
checkedIndex = i;
selected_answer = top.bottom_left.document.quiz_questions[checkedIndex].value;
}
}

if (selected_answer==answerValue) {
score++;
//The angelTableCorrect() function runs(see below).
angelTableCorrect();
//An alert pops up if nothing's checked, with a string telling the user to guess next time.
} else if (checkedIndex==-1){
alert("Next time," + " " + userName + "," + " " + "take a guess!");
//Because I'm heartless, the user isn't given a second chance. If not guess was made, angelTableWrong() executes (see below).
angelTableWrong();
} else {

angelTableWrong();

}
}


function textChecker() {
var answerValue=answers[currentQuestion-1];
//theWord represents the user's input.
var theWord = top.bottom_left.document.quiz_questions.text_field.value;

theWordLower=theWord.toLowerCase();
if(theWordLower==answerValue) {
score++;
angelTableCorrect();
} else if (theWord!=answerValue) {
angelTableWrong();
}
}

function angelTableCorrect () {
top.top_right.document.open();
top.top_right.document.write("<table align='left'>" +
"<tr>" + "<td align='center'>" + "<font face='Arial'>" + "Right," + " " +
userName + "!" + "<br>" + "You're" + " " + score + " " + "out of" + " " + currentQuestion +
"</td>" + "<td>" + "<img src='angel_correct.gif'>" + "</td>" +
"</tr>" + "</table>");
}

function angelTableWrong () {
top.top_right.document.open();
top.top_right.document.write("<table align='left'>" +
"<tr>" + "<td align='center'>" + "<font face='Arial'>" + "Wrong," + " " + userName + "." + "<br>" +
"You're" + " " + score + " " + "out of" + " " + currentQuestion +
"</td>" + "<td>" + "<img src='angel_wrong.gif'>" + "</td>" +
"</tr>" + "</table>");
}



function writeBeginning() {
top.bottom_left.document.clear();
top.bottom_left.document.open();
top.bottom_left.document.write("<html>" + "<head>" + "</head>" + "<body>" + "<form name='quiz_questions'>");
}

//This function writes the concluding part of each quiz question table in the bottom_left frame, except for the last one.
//The last one's Next button has to call a different function, so I wrote the next function to do that.
function writeEnding(){
top.bottom_left.document.write("<img name='fish_first' src='next.gif' align='right' onMouseOver='top.top_left.swapper();' onMouseOut='top.top_left.unswapper();' onMouseUp='top.top_left.onNext();'>" +
"</form>" + "</body>" + "</html>")
}

//This function writes the concluding part of the last question, which has a next button that calls a
//different function.
function writeEndingLast(){
top.bottom_left.document.write("<img name='fish_first' src='next.gif' align='right' onMouseOver='top.top_left.swapper();' onMouseOut='top.top_left.unswapper();' onMouseUp='top.top_left.writeMailTable();'>" +
"</form>" + "</body>" + "</html>")
}

function writeMailTable(){
top.top_right.document.open();
top.top_right.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "Thank you for" + "<br>" + "taking the quiz," + " " + userName + "!" + "<br><br>" + "</center>");
top.bottom_right.document.open();
top.bottom_right.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "If you don't have questions" + "<br>" + "you'd like to have answered," + " " + "<a href='http://www.archden.org' target='_blank')>" + "return to the" + "<br>" + "Archdiocese of Denver home page." + "</a>" + "</center>");
top.bottom_left.document.open();
top.bottom_left.document.write("<font face='arial, verdana, helvetica'>" + "Do you have questions about this quiz," + " " + userName + "?" + " " + "<img src='angel_final.gif' align='right'>" + "Post them in"
+ " " + "<a href='http://www.archden.org/ubb' target='_blank')>" + "The Upper Room," + "</a>" + " " + "the online community of the Archdiocese of Denver, in the 'What Does the Church Teach About ...?' forum!");
}


function onNext() {
//Write a table to the_questions.htm that includes a variable for the new question.
if(currentQuestion==3) {
currentQuestion++;
textChecker();
doTheMath();
top.bottom_left.document.open();
top.bottom_left.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "You got" + " " + "<b>" + finalPercent + "%" + "</b>" + " " + "of the questions right," + " " + userName + "!" + "<br>" + "Click on the 'Next' fish" + "<br>" + "one more time to find out" + "<br>" + "how to get answers for those questions you missed." + "</center>" + "</font>");
writeEndingLast();
} else {
currentQuestion++;
checkQuestionType();
writeBeginning();
writeEachQuestion();
writeEnding();
}
}

//The doTheMath function divides the score by 20, and that multiplies that value by 100 to come up
//with a final percentage value. That is used in the string written at the end (in the above onNext function).
function doTheMath(){
thePercent=score/4;
finalPercent=thePercent*100;
}
</script>
</head>
<body bgcolor="#FFFFFF" onLoad="writeBeginning(); writeEachQuestion(); writeEnding();">
<img src="title.gif" width="371" height="109">
<script language="JavaScript">
</script>
</body>
</html>
lm111
09-06-2011, 07:06 PM
Anyone pleaseeeeeeee??????
Old Pedant
09-06-2011, 08:32 PM
It's just such ugly code in the first place that I suspect nobody wants to try to extend it into even uglier stuff.

It really and truly should be redesigned from the beginning.

Are you brave enough to tackle that?
lm111
09-07-2011, 03:38 PM
I have posted a much simpler quiz here http://www.codingforums.com/showthread.php?p=1133055#post1133055

Could someone help please??? Thank you
jmrker
09-08-2011, 04:03 AM
I have posted a much simpler quiz here http://www.codingforums.com/showthread.php?p=1133055#post1133055

Could someone help please??? Thank you

I have posted a possible solution at the link above
that you have failed to acknowledge as of this time. :confused:

One other reason you should post only one problem per thread. :eek: :rolleyes:

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum