Solved

Creating a exam page

Posted on 2003-11-26
20
349 Views
Last Modified: 2010-08-05
I have created a exam that I want to give to people in my department,
I have created all the pages. Basically I want them to choose a multi choice answer from Q1.html,
and then go to Q2.html. at the end, END.html I want it to report there answers from Q1 - Q10.

They will print out the END page and I will grade manually

Ex:

Q1 - A
Q2 - C
0
Comment
Question by:CMILLER
  • 10
  • 4
  • 2
  • +3
20 Comments
 
LVL 4

Expert Comment

by:ainapure
ID: 9828417
sounds like you will need something more than just pure HTML. Are you famaliar with ASP and do you have access to any sort of web server?

-amit
0
 

Author Comment

by:CMILLER
ID: 9828439
I know a little about ASP, I have created before a ASP page that connected to a data base.

I want something that I can build and burn on a cdrom, for exam taking

I dont have access to a web server.
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9828537
http://timbo87.home.comcast.net/temp/quiz/Q1.html

This runs entirely in HTML and JavaScript and needs no server, only a computer with a web browser. As of yet I haven't written any checks to make sure that the user enters a value. Also, if you vote again before the next question loads it will answer as undefined, but this won't be an issue since it's running off a CD. Please have a look at it and tell me what you think. If you like this, please tell me and I will further develop it into a final product.
0
 
LVL 3

Expert Comment

by:IGneon10
ID: 9828587
Nice.  It's even NS compatible.
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9828676
Timbo87,
Can you post the code here that you used in your example, for reference?

Thanks,
georgemarian
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9828682
Hi George,

I'll post the full code with documentation once an answer is accepted.
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9828753
It's just a matter of protocol - whatever is being discussed in the thread should be readily available to all the contributors (in case your site goes down, etc.) It really should be posted either way...

thanks.
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9828815
Hi George,

I'll do that as soon as it's 100% complete. As of now it still needs a few things added like I mentioned above and I wanted to make sure it was an acceptable solution before I posted it. (Don't want to post unfinished code) I can give an explanation of how it works though.

The first thing it does is scans to find which radio button is picked. I have the values for each radio button as "A", "B", "C", and "D". It stores the current URL in a string, then uses indexOf to location the "html" extension. I use a substring to read everything after "html" and store it in the variable astring. It then changes the URL of the page to Q(next question number).html?(anything stored in astring) + (the current answer) + ",". It does this for each page. I stored the answers values in the address bar because that's about the only way to transfer data between documents in pure HTML/JavaScript. The last page reads the astring, which by now looks something like this "A,C,B,D,A,"..etc and breaks it up every two characters and stores it in an array, so it stores like this:
answers[0] = "A"
answers[1] = "C"
The data is displayed with a loop that reads from the array and writes the values with the associated questions.

Hope this clears it up a bit. I'll post the final code as soon as its final right here.
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9829760
I've added error checking and spruced up the output page a little. If you want to accept the answer please contact me at (Removed by Computer101) and I can walk you through customization and some other points of the script and give you an HTML CD autolauncher I made.
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 7

Expert Comment

by:gam3r_3xtr3m3
ID: 9831140
why not use a single page for that? using separate <div> tags so you won't transfer HTML inputs through Query Strings?
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9832404
Sorry about that. It's a lot of code and it's broken up a bit by page. I'm not sure how much CMiller has done with JavaScript so it may be a bit tricky to set up without prior JavaScript knowledge. I'll post the code and see how it goes.
0
 
LVL 15

Accepted Solution

by:
Timbo87 earned 500 total points
ID: 9832457
Q1.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 2
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 1
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q2.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 3
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 2
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q3.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 4
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 3
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q4.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 5
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 4
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q5.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 6
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 5
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q6.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 7
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 6
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q7.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 8
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 7
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q8.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 9
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 8
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q9.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = 10
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 9
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

Q10.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans
var found = false
var nextq = "Final"
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans = f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 10
<br>
<input type=radio name="ques" value="A"> Answer A
<br>
<input type=radio name="ques" value="B"> Answer B
<br>
<input type=radio name="ques" value="C"> Answer C
<br>
<input type=radio name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

QFinal.html

<html>
<head>
<title>Results</title>
</head>
<body>
<center>
<h2>Results</h2>
</center>
<br>
<script language="JavaScript" type="text/javascript">
wn = window.location+""
var answers = new Array()
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
var ancnt = 0
for(i=0;i<astring.length;i+=2)
{
answers[ancnt] = astring.charAt(i)
ancnt++
}
for(j=0;j<answers.length;j++)
document.write(j+1 + ". " + answers[j] + "<br>")
</script>
<br>
<center>
<input type="button" value="Print Results" onClick="window.print()">
</center>
</body>
</html>

For every additional Qpage you want to add, copy one of the previous pages and change the nextq variable. So if you wanted to add question 11, make a copy of question 10. Then change nextq in Q10.html to 11 to point to question 11. Make sure the last question always points to "Final" in the nextq variable. If you need any help with customization please post.
0
 

Author Comment

by:CMILLER
ID: 9832693
Timbo87, Great Job

I was able to get all working even creating a new page ( 11 ) , how can I make a question
that there might be two, three ... answers ( a checkbox ). Also, If I want to have a index page
what would need to be in there to point to the first question, Just a link?

Can you post code for the HTML CD autolauncher, I want to burn a test cd.

Again Great Job, I will be increasing points for you

Chris
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9832784
Hi Chris,

I'll work on modifying the code so it supports multiple answers. You can link to Q1.html like any other link. I made a BAT file autolauncher which will work on any Windows computer.

Make a file named autorun.inf and put this in the file:
[autorun]
open=run.bat

Next make a file named run.bat and put this in the file:
@echo off
index.html

Rename index.html to whatever the first page you want display is. If you put the quiz in a subfolder, for example, named quiz, make sure you update the BAT file like this:

@echo off
cd quiz
index.html

autorun.inf must be in the root CD directory and I recommend putting run.bat in there, too.
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9832798
Will the checkbox pages only have checkboxes or will they have checkboxes and radio buttons?
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9832907
Hi Chris,

Here's a modified version that supports checkboxes. I've remade QFinal.html.

QFinal.html

<html>
<head>
<title>Results</title>
</head>
<body>
<center>
<h2>Results</h2>
</center>
<br>
<script language="JavaScript" type="text/javascript">
wn = window.location+""
var answers = new Array()
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
var ancnt = 0

for(i=0;i<astring.length;i++)
{
if(astring.charAt(i) == ",")
{
ancnt++
continue;
}
if(answers[ancnt] == null) answers[ancnt] = ""
answers[ancnt] += astring.charAt(i)
}

for(j=0;j<answers.length;j++)
document.write(j+1 + ". " + answers[j] + "<br>")
</script>
<br>
<center>
<input type="button" value="Print Results" onClick="window.print()">
</center>
</body>
</html>

Here's an example "Question 11" I know you've already made one but this connects with the example above. All you need to do is rename it and make sure to change the nextq variable.

Q11.html

<script language="JavaScript" type="text/javascript">
function submitAnswer(f)
{
var ans = ""
var found = false
var nextq = "Final"
for(i=0;i<f.ques.length;i++)
{
if(f.ques[i].checked)
      {
            ans += f.ques[i].value
            found = true
      }
}
if(!found)
{
      alert("Please choose an answer.")
      return false
}
var wn = window.location+""
var astring = wn.substring(wn.indexOf("html") + 5,wn.length)
window.location = "Q" + nextq + ".html?" + astring + ans + ","
}
</script>
<form name=qu>
Question 11
<br>
<input type=checkbox name="ques" value="A"> Answer A
<br>
<input type=checkbox name="ques" value="B"> Answer B
<br>
<input type=checkbox name="ques" value="C"> Answer C
<br>
<input type=checkbox name="ques" value="D"> Answer D
<br>
<input type="button" value="Next" onClick="submitAnswer(qu)">
</form>

As I said above, if you want one that mixes checkboxes and radio buttons, please tell me and I'll rewrite the code to include them.
0
 

Author Comment

by:CMILLER
ID: 9835158
Timbo87,

All works great, Yes, I just wanted radio or check boxes not both in the same question.

Thanks for the HTML autorun, I changed the run.bat to

@echo off
start index.html

This way the cmd window will close after the index.html loads

I wanted to find out if you would like to continue to work on this project, I would post another question.

I would like to have it check against answers on the QFinal.html or what ever it would take to
do it. Sorry this is a after thought.

Example:

RESULTS

1. A         Correct ( Have this text in green)
2. B         Wrong ( Have this in red ) A is the correct answer



At the bottom of the QFinal page have a box like a " Next " box for each question, where I could click to go to that question or would it be best to just add a link. So, it would then go to Q2 and I could review, then I guess I could click the back button in the browser and it would take me back to the QFinal page. What would it take to get it to score a %.

Thanks
Chris
0
 
LVL 15

Expert Comment

by:Timbo87
ID: 9835206
Hi Chris,

Thanks for the points. Everything you suggested is feasible in JavaScript, including a scored percentage. The only little quirk is that by the nature of JavaScript, the answers would be available by viewing the source code on QFinal.html, although I can hide them a bit so it's not blatantly obvious. If you'd like to post this as a separate question I can probably get you working code by tomorrow (Friday).

Thanks,
Tim
0
 

Author Comment

by:CMILLER
ID: 9835231
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Jump to a specific point on a responsive page 5 28
CSS measurement 10 34
My dialog box isnt work, no box displays but text does 8 39
.php tree directory? 5 57
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…

863 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

28 Experts available now in Live!

Get 1:1 Help Now