Hi Everyone
1st thanks to all for checkin out my question
I am relatively new to JavaScript so I apologise to all if my wording is wrong.
Basically I have designed a quiz with a little help and at the moment it works great for radio buttons and combo boxes.
My main problem is with the numbering as some questions have multiple parts ie a,b,c and I want them to be numbered accordingly. As you can see from my code the seperate parts of the one question actually get numbered as different questions. How can I make the numbering number parts differently ie question 2) a) and then b) instead of 2 and then 3??
Additionally I would also like to use text boxes but can't figure out how to code in the correct JS for Question type Text Box??
Here is my Html code and my script
My HTML Code- MultiChoiceQuest.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
<html><!-- InstanceBegin -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- InstanceBeginEditable name="doctitle" -->
<title>Multiple Choice Questionnaire</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
<link rel="stylesheet" href="../../../../style.css">
<!-- InstanceEndEditable -->
<script type="text/javascript" src="Script.js"></script>
<script language="javascript" type="text/javascript">
var done = new Array;
var yourAns = new Array;
var score = 0;
var ScoreMax;
function checkAllChecked(){
var a = document.forms[0].elements;
for(var i = 0 ; i < a.length ; ++i) {
if(a.type == "radio") {
var radiogroup = a[a.name];
var itemchecked = false;
for(var j = 0 ; j < radiogroup.length ; ++j) {
if(radiogroup[j].checked){
itemchecked = true;
break;
}
}
if(!itemchecked) {
alert("Please answer all questions");
if(a.focus)
a.focus();
return false;
}
}
}
return Score();
}
function getRBtnName(GrpName) {
var sel = document.getElementsByName(GrpName);
var fnd = -1;
var str = '';
for (var i=0; i<sel.length; i++) {
if (sel.checked == true) { str = sel.value; fnd = i; }
}
return str;
}
function StatusAllCheckboxes(IDS,cnt) {
var str = '';
IDS = 'q'+IDS;
var tmp = '';
for (var i=0; i<cnt; i++) {
tmp = document.getElementById(IDS+'_'+i);
if (tmp.checked) { str += tmp.value + '|'; }
}
return str;
}
function Engine(question, answer, Qtype) {
switch (Qtype) {
case "RB" : yourAns[question] = answer; break;
case "SB" : yourAns[question] = answer; break;
case "TB" : yourAns[question] = answer; break;
default : yourAns[question] = ''; alert('Invalid question type: '+Qtype); break;
}
}
function Score(){
score = 0;
var tmp = '';
var answerText = "<p>"; // alert('Size of QR: '+QR.length);
for (var i=1; i<QR.length; i++) {
answerText = answerText+"<br>Question :"+i+" Your Answer: "+yourAns+"<br>";
tmp = QR[3];
if (tmp != yourAns) {
answerText = answerText+"<font color='red'>Try Again</font>"+"<br>"+explainAnswer+"<hr>" ;
} else {
answerText = answerText+ " <font color='green'> Correct </font><hr>";
score++;
}
}
answerText=answerText+"<br><br>Your total score is : "+score+" out of "+(QR.length-1)+"<br>";
var ScoreMax = QR.length-1;
var ScoreInc = Math.floor(ScoreMax / 4); // Don't have fewer than 5 questions.
answerText=answerText+"<br>Comment : ";
if(score<=ScoreInc){ answerText=answerText+"It seems you need a bit more practice. Try Reading the Presentation Again"; }
if(score>=(ScoreInc+1) && score <=(ScoreInc*2)){ answerText=answerText+"Need a bit of work"; }
if(score>=(ScoreInc*2+1) && score <=(ScoreInc*3)){ answerText=answerText+"Not Bad, Keep Trying"; }
if(score>(ScoreInc*3+1)){ answerText=answerText+"You're almost there"; }
if (score!=(ScoreMax))
{
var w = window.open('', '', 'height=500,width=750,scrollbars');
w.document.open();
w.document.write(answerText);
w.document.close();
return false;
}
else
{
window.resizeTo(screen.width, screen.height)
return true;
}
}
</script>
</head>
<body class="design">
<!-- InstanceBeginEditable name="Body of Information" -->
<table class="main" width="100%" border="10">
<tr><td class="heading" ><img src="../images/multi.gif" alt=""></td></tr>
</table>
<br><br>
<!-- InstanceEndEditable -->
<form name="multichoice" action='./eml_1.php' method='post' onload='reset()' onsubmit= "return checkAllChecked()">
<ol>
<script type="text/javascript">
var str = '';
var tmpr = [];
var resp = ['a','b','c','d','e','f','g','h','i','j'];
for (q=1; q<QR.length; q++) {
str += '<li>'+QR[q][1]+'</li><br />';
tmpr = QR[q][2].split('|');
switch (QR[q][0]) {
case 'RB' :
for (var r=0; r<tmpr.length; r++) {
str += '<input type="radio" name="q'+q+'" value="'+resp[r]+'"';
str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')">';
str += resp[r]+' '+tmpr[r]+'<br />';
} break;
case 'SB' :
str += '<select name="q'+q+'" size="1" id="q'+q+'"';
str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')">';
for (var r=0; r<tmpr.length; r++) {
str += '<option value="'+resp[r]+'">';
str += tmpr[r]+'</option>';
} str += '</select>'; break;
case 'TB' :
for (var r=0; r<tmpr.length; r++) {
str += '<input type="text" name="q'+q+'" value="'+resp[r]+'"';
str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')">';
str += resp[r]+' '+tmpr[r]+'<br />';
} break;
/* test code for future entries
case 'CBM' : break;
case 'SBM' :
str += '<select name="q'+q+'" size="1" id="q'+q+'"';
str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')" multiple>';
for (var r=0; r<tmpr.length; r++) {
str += '<option name="q'+q+'" value="'+resp[r]+'">';
str += tmpr[r]+'</option>';
} str += '</select>'; break;
*/
default : str += q+': Invalid type: '+QR[q][0]; break;
}
str += "<p />";
}
document.write(str);
</script>
<input type=submit value="Submit?">
</ol>
</form>
<br><br>
<noscript>
<center>
<h2>Sorry This Page Requires JavaScript</h2>
<a class="link" href="../nojavascript.html">Click here if You can see this Message. You Need To Enable JavaScript.
</a>
</center>
</noscript>
</body>
<!-- InstanceEnd --></html>
My Script Code- Script.js
var QR = [
['Question type','Question','Responses,...','Answers,...'], // format of array
['RB', "What team is on top of the ladder in the AFL?",
"St Kilda|Geelong|West Coast|Collingwood","a"],
['SB', "Identify the INTERNAL and EXTERNAL factors? <br><br>a. Mould",
"Please Select an Option|Internal|External","b"],
['SB', "b. Rain",
"Please Select an Option|Internal|External","c"],
['RB', "Who Is the fastest man in the world:",
"Matt Shervington|Carl Lewis|Usain Bolt|Kathy Freeman","c"],
['TB', "Number the following accordingly; 1 , 2 or 3:",
"1+2","3"],
['TB', "",
"2-1","1"],
['TB', "",
"3-1","2"],
['SB', "14. Indicate if the following statements are true or false: <br><br>a. Red is Black",
"Please Select an Option|True|False","c"],
['SB', "b. Red is Blue",
"Please Select an Option|True|False","c"],
['SB', "c. Red is Red",
"Please Select an Option|True|False","b"],
['SB', "d. White is Red",
"Please Select an Option|True|False","c"] // no comma after last entry
];
var explainAnswer = [
"", // unused entry
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect" // No comma after last entry
];
There may be some code that is not required, so ignore that if it is present. If you want to know anything else or if I am unclear please ask a question. I would really like to solve this for my quiz. Thanks very much for any help anyone can give me. Like I said I am new to Javascript so you would be doing me a great favour by helping me out
Thank you
1st thanks to all for checkin out my question
I am relatively new to JavaScript so I apologise to all if my wording is wrong.
Basically I have designed a quiz with a little help and at the moment it works great for radio buttons and combo boxes.
My main problem is with the numbering as some questions have multiple parts ie a,b,c and I want them to be numbered accordingly. As you can see from my code the seperate parts of the one question actually get numbered as different questions. How can I make the numbering number parts differently ie question 2) a) and then b) instead of 2 and then 3??
Additionally I would also like to use text boxes but can't figure out how to code in the correct JS for Question type Text Box??
Here is my Html code and my script
My HTML Code- MultiChoiceQuest.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
<html><!-- InstanceBegin -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- InstanceBeginEditable name="doctitle" -->
<title>Multiple Choice Questionnaire</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
<link rel="stylesheet" href="../../../../style.css">
<!-- InstanceEndEditable -->
<script type="text/javascript" src="Script.js"></script>
<script language="javascript" type="text/javascript">
var done = new Array;
var yourAns = new Array;
var score = 0;
var ScoreMax;
function checkAllChecked(){
var a = document.forms[0].elements;
for(var i = 0 ; i < a.length ; ++i) {
if(a.type == "radio") {
var radiogroup = a[a.name];
var itemchecked = false;
for(var j = 0 ; j < radiogroup.length ; ++j) {
if(radiogroup[j].checked){
itemchecked = true;
break;
}
}
if(!itemchecked) {
alert("Please answer all questions");
if(a.focus)
a.focus();
return false;
}
}
}
return Score();
}
function getRBtnName(GrpName) {
var sel = document.getElementsByName(GrpName);
var fnd = -1;
var str = '';
for (var i=0; i<sel.length; i++) {
if (sel.checked == true) { str = sel.value; fnd = i; }
}
return str;
}
function StatusAllCheckboxes(IDS,cnt) {
var str = '';
IDS = 'q'+IDS;
var tmp = '';
for (var i=0; i<cnt; i++) {
tmp = document.getElementById(IDS+'_'+i);
if (tmp.checked) { str += tmp.value + '|'; }
}
return str;
}
function Engine(question, answer, Qtype) {
switch (Qtype) {
case "RB" : yourAns[question] = answer; break;
case "SB" : yourAns[question] = answer; break;
case "TB" : yourAns[question] = answer; break;
default : yourAns[question] = ''; alert('Invalid question type: '+Qtype); break;
}
}
function Score(){
score = 0;
var tmp = '';
var answerText = "<p>"; // alert('Size of QR: '+QR.length);
for (var i=1; i<QR.length; i++) {
answerText = answerText+"<br>Question :"+i+" Your Answer: "+yourAns+"<br>";
tmp = QR[3];
if (tmp != yourAns) {
answerText = answerText+"<font color='red'>Try Again</font>"+"<br>"+explainAnswer+"<hr>" ;
} else {
answerText = answerText+ " <font color='green'> Correct </font><hr>";
score++;
}
}
answerText=answerText+"<br><br>Your total score is : "+score+" out of "+(QR.length-1)+"<br>";
var ScoreMax = QR.length-1;
var ScoreInc = Math.floor(ScoreMax / 4); // Don't have fewer than 5 questions.
answerText=answerText+"<br>Comment : ";
if(score<=ScoreInc){ answerText=answerText+"It seems you need a bit more practice. Try Reading the Presentation Again"; }
if(score>=(ScoreInc+1) && score <=(ScoreInc*2)){ answerText=answerText+"Need a bit of work"; }
if(score>=(ScoreInc*2+1) && score <=(ScoreInc*3)){ answerText=answerText+"Not Bad, Keep Trying"; }
if(score>(ScoreInc*3+1)){ answerText=answerText+"You're almost there"; }
if (score!=(ScoreMax))
{
var w = window.open('', '', 'height=500,width=750,scrollbars');
w.document.open();
w.document.write(answerText);
w.document.close();
return false;
}
else
{
window.resizeTo(screen.width, screen.height)
return true;
}
}
</script>
</head>
<body class="design">
<!-- InstanceBeginEditable name="Body of Information" -->
<table class="main" width="100%" border="10">
<tr><td class="heading" ><img src="../images/multi.gif" alt=""></td></tr>
</table>
<br><br>
<!-- InstanceEndEditable -->
<form name="multichoice" action='./eml_1.php' method='post' onload='reset()' onsubmit= "return checkAllChecked()">
<ol>
<script type="text/javascript">
var str = '';
var tmpr = [];
var resp = ['a','b','c','d','e','f','g','h','i','j'];
for (q=1; q<QR.length; q++) {
str += '<li>'+QR[q][1]+'</li><br />';
tmpr = QR[q][2].split('|');
switch (QR[q][0]) {
case 'RB' :
for (var r=0; r<tmpr.length; r++) {
str += '<input type="radio" name="q'+q+'" value="'+resp[r]+'"';
str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')">';
str += resp[r]+' '+tmpr[r]+'<br />';
} break;
case 'SB' :
str += '<select name="q'+q+'" size="1" id="q'+q+'"';
str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')">';
for (var r=0; r<tmpr.length; r++) {
str += '<option value="'+resp[r]+'">';
str += tmpr[r]+'</option>';
} str += '</select>'; break;
case 'TB' :
for (var r=0; r<tmpr.length; r++) {
str += '<input type="text" name="q'+q+'" value="'+resp[r]+'"';
str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')">';
str += resp[r]+' '+tmpr[r]+'<br />';
} break;
/* test code for future entries
case 'CBM' : break;
case 'SBM' :
str += '<select name="q'+q+'" size="1" id="q'+q+'"';
str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')" multiple>';
for (var r=0; r<tmpr.length; r++) {
str += '<option name="q'+q+'" value="'+resp[r]+'">';
str += tmpr[r]+'</option>';
} str += '</select>'; break;
*/
default : str += q+': Invalid type: '+QR[q][0]; break;
}
str += "<p />";
}
document.write(str);
</script>
<input type=submit value="Submit?">
</ol>
</form>
<br><br>
<noscript>
<center>
<h2>Sorry This Page Requires JavaScript</h2>
<a class="link" href="../nojavascript.html">Click here if You can see this Message. You Need To Enable JavaScript.
</a>
</center>
</noscript>
</body>
<!-- InstanceEnd --></html>
My Script Code- Script.js
var QR = [
['Question type','Question','Responses,...','Answers,...'], // format of array
['RB', "What team is on top of the ladder in the AFL?",
"St Kilda|Geelong|West Coast|Collingwood","a"],
['SB', "Identify the INTERNAL and EXTERNAL factors? <br><br>a. Mould",
"Please Select an Option|Internal|External","b"],
['SB', "b. Rain",
"Please Select an Option|Internal|External","c"],
['RB', "Who Is the fastest man in the world:",
"Matt Shervington|Carl Lewis|Usain Bolt|Kathy Freeman","c"],
['TB', "Number the following accordingly; 1 , 2 or 3:",
"1+2","3"],
['TB', "",
"2-1","1"],
['TB', "",
"3-1","2"],
['SB', "14. Indicate if the following statements are true or false: <br><br>a. Red is Black",
"Please Select an Option|True|False","c"],
['SB', "b. Red is Blue",
"Please Select an Option|True|False","c"],
['SB', "c. Red is Red",
"Please Select an Option|True|False","b"],
['SB', "d. White is Red",
"Please Select an Option|True|False","c"] // no comma after last entry
];
var explainAnswer = [
"", // unused entry
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect",
"Your Answer is Incorrect" // No comma after last entry
];
There may be some code that is not required, so ignore that if it is present. If you want to know anything else or if I am unclear please ask a question. I would really like to solve this for my quiz. Thanks very much for any help anyone can give me. Like I said I am new to Javascript so you would be doing me a great favour by helping me out
Thank you