Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

Javascript Quiz Problem

Options
  • 24-04-2006 1:27pm
    #1
    Cork Skate
    Registered Users Posts: 884 ✭✭✭


    Hi there, i seem to be having a problem with a javascript quiz.
    I had been working on it, building it up bit by bit, and i have changed something (i dont know what) and its now not working. I think that this is something really small to be honest. Can anyone see what it is?
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>

<head><title>assignment 2</title>
	
<script language="javascript">

		int result=0;
		var treone;
	        var furone;
		var fivone;
		var fivtwo;
		var fivtre;
		var sixone;
		var sixtwo;
		var sixtre;


	function checkanswers()
	{
		alert("You got "+ result +" out of 6");
		var ansone = document.quizform.questionone.value;
		var anstwo = document.quizform.questiontwo.value;
				
		if (ansone=="Paris" || ansone=="PARIS" || ansone=="paris" || ansone=="city of lights")
		{ 
		result++;
		}

		if (anstwo=="rome" || anstwo=="ROME" || anstwo=="Rome")
		(
		result++;
		}

		if (document.quizform.questionthree.selectedIndex=="1")
		{
		result++;
		treone="Good to recycle";
		}

		if (document.quizform.questionfour.selectedIndex=="1")
		{
		result++;
		furone="Recycle Bin";
		} 

	   	if (document.quizform.option1.checked==true || document.quizform.option2.checked==true || document.quizform.option3.checked==true)
		{
		result++;
		}
                 
		if (document.quizform.option4.checked==true || document.quizform.option5.checked==true || document.quizform.option6.checked==true)
		{
		result++;
		}

		{
		alert("Your answer to Question One was "+ ansone +",\n Your answer to Question Two was "+ anstwo +",\n Your answer to Question Three was "+ treone +",\n Your answer to Question Four was "+ furone +",\n Your answer to Question Five was "+ fivone +" "+ fivtwo +" "+ fivtre +",\n Your answer to Question Six was "+ sixone +" "+ sixtwo +" "+ sixtre +".");
		alert("You got "+ result +" out of 6");
		}

	}
</script>
	</head>

	<body>
	<center> <BR> <BR> <BR> <BR>

		<form name="quizform">
		<table border=2 cellpadding=10>
		<caption align=top> <font color=blue font size=+1><I>page1!</I></font> </caption>
		
			<TR Align=center>
			<TD> 
			<BR>

				<p>

				<font color=red font size=-2> <B> <I> QUESTION ONE </I> </B> </font> <BR>
				What is the capital of France ? <BR>
				<input type="text" name="questionone"> 
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION TWO </I> </B> </font> <BR>
				 What is the capital of Italy? <BR>
				<input type="text" name="questiontwo"> 
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION THREE </I> </B> </font> <BR>
				Is it better to buy recycled products instead of non-recycled products ? <BR>
					<select name="questionthree">

						<option value="oneblank">--select an answer--</option>
						<option value="yes">yes, its good for the environment </option>
						<option value="no">no, its bad for the enviroment </option>
					</select>
				</p> <BR>

				<p>

				<font color=red font size=-2> <B> <I> QUESTION FOUR </I> </B> </font> <BR>
				What should you do with your recyclable waste ? <BR>
					<select name="questionfour">
						<option value="twoblank">--select an answer--</option>

						<option value="recycle">bring it to a recycle bin</option>
						<option value="waste">bring it to the dump</option>
					</select>
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION FIVE </I> </B> </font> <BR>

					Which of the following is a colour ?<br>
						<input type="checkbox" name="option1" value="red"> red<br>
	                    <script>if (option4=true) then var fivone=red</script>
						<input type="checkbox" name="option2" value="sky"> sky<br>
	                    <script>if (option4=true) then var fivtwo=sky</script>

						<input type="checkbox" name="option3" value="dog"> dog<br>
	                    <script>if (option4=true) then var fivtre=dog</script>
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION SIX </I> </B> </font> <BR>

				Which one do you sit on ?<br>
				<input type="checkbox" name="option4" value="stool"> stool <br>
				<script>if (option4=true) then var sixone=stool</script>
				<input type="checkbox" name="option5" value="fridge"> fridge<br>
                        	<script>if (option4=true) then var sixtwo=fridge</script>
				<input type="checkbox" name="option6" value="kettle"> kettle<br>
				<script>if (option4=true) then var sixtre=kettle</script>
				</p> <BR>				

				<HR>

				<p> 
				<input type="button" value="Submit Button " name="answerbutton" onClick="javascript:checkanswers()"> 
				<input type="reset" value="Restart the Quiz" name="restartbutton">
				</p> 
			</TD>

			</TR>
		</table>
		</form>
	</center>
	</body>
</html>


Comments

  • Options
    #2
    louie
    Closed Accounts Posts: 1,200 ✭✭✭louie


    if (anstwo=="rome" || anstwo=="ROME" || anstwo=="Rome")
    ( //should be {

    can you not make the code simpler using strtoupper

    if (anstwo.toUpperCase() == "ROME")
    {


  • Options
    #3
    Cork Skate
    Registered Users Posts: 884 ✭✭✭Cork Skate


    louie wrote:
    if (anstwo=="rome" || anstwo=="ROME" || anstwo=="Rome")
    ( //should be {

    can you not make the code simpler using strtoupper

    if (anstwo.toUpperCase() == "ROME")
    {


    Thats great, alot better that way actually ...

    Its nearly working now aswell .... its just the checkboxes are coming back with undefined ..... any ideas, i just it to take what ever is selected in Question Five and Six and pass them out in the alert message .... any ideas?
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>

<head><title>assignment 2</title>
	
<script language="javascript">

		var result=0;
		var treone;
	        var furone;
		var fivone;
		var fivtwo;
		var fivtre;
		var sixone;
		var sixtwo;
		var sixtre;


	function checkanswers()
	{
		var ansone = document.quizform.questionone.value;
		var anstwo = document.quizform.questiontwo.value;
				
		if (ansone.toUpperCase() == "PARIS")
		{ 
		result++;
		}

		if (anstwo.toUpperCase() == "ROME")
		{
		result++;
		}

		if (document.quizform.questionthree.selectedIndex=="1")
		{
		result++;
		treone="Good to recycle";
		}

		if (document.quizform.questionfour.selectedIndex=="1")
		{
		result++;
		furone="Recycle Bin";
		} 

	   	if (document.quizform.option1.checked==true || document.quizform.option2.checked==true || document.quizform.option3.checked==true)
		{
		result++;
		}
                 
		if (document.quizform.option4.checked==true || document.quizform.option5.checked==true || document.quizform.option6.checked==true)
		{
		result++;
		}

		{
		alert("Your answer to Question One was "+ ansone +",\n Your answer to Question Two was "+ anstwo +",\n Your answer to Question Three was "+ treone +",\n Your answer to Question Four was "+ furone +",\n Your answer to Question Five was "+ fivone +" "+ fivtwo +" "+ fivtre +",\n Your answer to Question Six was "+ sixone +" "+ sixtwo +" "+ sixtre +".");
		alert("You got "+ result +" out of 6");
		}

	}
</script>
	</head>

	<body>
	<center> <BR> <BR> <BR> <BR>

		<form name="quizform">
		<table border=2 cellpadding=10>
		<caption align=top> <font color=blue font size=+1><I>page1!</I></font> </caption>
		
			<TR Align=center>
			<TD> 
			<BR>

				<p>

				<font color=red font size=-2> <B> <I> QUESTION ONE </I> </B> </font> <BR>
				What is the capital of France ? <BR>
				<input type="text" name="questionone"> 
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION TWO </I> </B> </font> <BR>
				 What is the capital of Italy? <BR>
				<input type="text" name="questiontwo"> 
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION THREE </I> </B> </font> <BR>
				Is it better to buy recycled products instead of non-recycled products ? <BR>
					<select name="questionthree">

						<option value="oneblank">--select an answer--</option>
						<option value="yes">yes, its good for the environment </option>
						<option value="no">no, its bad for the enviroment </option>
					</select>
				</p> <BR>

				<p>

				<font color=red font size=-2> <B> <I> QUESTION FOUR </I> </B> </font> <BR>
				What should you do with your recyclable waste ? <BR>
					<select name="questionfour">
						<option value="twoblank">--select an answer--</option>

						<option value="recycle">bring it to a recycle bin</option>
						<option value="waste">bring it to the dump</option>
					</select>
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION FIVE </I> </B> </font> <BR>

				Which of the following is a colour ?<br>
				<input type="checkbox" name="option1" value="red"> red<br>
				<script>if (option4=true) {var fivone="red"} </script>
				<input type="checkbox" name="option2" value="sky"> sky<br>
				<script>if (option4=true) {var fivtwo="sky"} </script>
				<input type="checkbox" name="option3" value="dog"> dog<br>
				<script>if (option4=true) {var fivtre="dog"} </script>
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION SIX </I> </B> </font> <BR>

				Which one do you sit on ?<br>
				<input type="checkbox" name="option4" value="stool"> stool <br>
				<script>if (option4=true) {var sixone="stool"} </script>
				<input type="checkbox" name="option5" value="fridge"> fridge<br>
                        	<script>if (option4=true) {var sixtwo="fridge") </script>
				<input type="checkbox" name="option6" value="kettle"> kettle<br>
				<script>if (option4=true) {var sixtre="kettle") </script>
				</p> <BR>				

				<HR>

				<p> 
				<input type="button" value="Submit Button " name="answerbutton" onClick="javascript:checkanswers()"> 
				<input type="reset" value="Restart the Quiz" name="restartbutton">
				</p> 
			</TD>

			</TR>
		</table>
		</form>
	</center>
	</body>
</html>


  • Options
    #4
    louie
    Closed Accounts Posts: 1,200 ✭✭✭louie


    this will help you:

    Checkboxes

    Checkboxes need a slightly different approach. We already know their values, but want to know whether the user has checked them. The checked property tells us. It can have two values: true or false.
    Now we do:

    if (document.forms[0].checkbox.checked){
    user_input = document.forms[0].checkbox.name
    }

    in which checkbox is the name of the checkbox. If the checkbox is checked, we take its name (or its value) and transfer it to user_input.
    To check a checkbox, set its property checked to true:


  • Options
    #5
    Cork Skate
    Registered Users Posts: 884 ✭✭✭Cork Skate


    I'm after getting a bit further now but still cant get Ques Five and Six to the alert message .... and the result count is wrong aswell ... any ideas
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>

<head><title>assignment 2</title>
	
<script language="javascript">

		var result=0;
		var treone;
	        var furone;
		var fivone;
		var fivtwo;
		var fivtre;
		var sixone;
		var sixtwo;
		var sixtre;


	function checkanswers()
	{
		var ansone = document.quizform.questionone.value;
		var anstwo = document.quizform.questiontwo.value;
				
		if (ansone.toUpperCase() == "PARIS")
		{ 
		result++;
		}

		if (anstwo.toUpperCase() == "ROME")
		{
		result++;
		}

		if (document.quizform.questionthree.selectedIndex=="1")
		{
		result++;
		treone="Good to recycle";
		}
		else 
		{
		furone="Wrong";
		} 

		if (document.quizform.questionfour.selectedIndex=="1")
		{
		result++;
		furone="Recycle Bin";
		}
		else 
		{
		furone="Wrong";
		} 

[B]	   	if (document.quizform.option1.checked==true || document.quizform.option2.checked==true || document.quizform.option3.checked==true)
		{
		result++;
		}[/B]
                 
		if (document.quizform.option4.checked==true || document.quizform.option5.checked==true || document.quizform.option6.checked==true)
		{
		result++;
		}

		{
		alert("Your answer to Question One was "+ ansone +",\n Your answer to Question Two was "+ anstwo +",\n Your answer to Question Three was "+ treone +",\n Your answer to Question Four was "+ furone +",\n Your answer to Question Five was "+ fivone +" "+ fivtwo +" "+ fivtre +",\n Your answer to Question Six was "+ sixone +" "+ sixtwo +" "+ sixtre +".");
		alert("You got "+ result +" out of 6");
		}

	}
</script>
	</head>

	<body>
	<center> <BR> <BR> <BR> <BR>

		<form name="quizform">
		<table border=2 cellpadding=10>
		<caption align=top> <font color=blue font size=+1><I>page1!</I></font> </caption>
		
			<TR Align=center>
			<TD> 
			<BR>

				<p>

				<font color=red font size=-2> <B> <I> QUESTION ONE </I> </B> </font> <BR>
				What is the capital of France ? <BR>
				<input type="text" name="questionone"> 
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION TWO </I> </B> </font> <BR>
				 What is the capital of Italy? <BR>
				<input type="text" name="questiontwo"> 
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION THREE </I> </B> </font> <BR>
				Is it better to buy recycled products instead of non-recycled products ? <BR>
					<select name="questionthree">

						<option value="oneblank">--select an answer--</option>
						<option value="yes">yes, its good for the environment </option>
						<option value="no">no, its bad for the enviroment </option>
					</select>
				</p> <BR>

				<p>

				<font color=red font size=-2> <B> <I> QUESTION FOUR </I> </B> </font> <BR>
				What should you do with your recyclable waste ? <BR>
					<select name="questionfour">
						<option value="twoblank">--select an answer--</option>

						<option value="recycle">bring it to a recycle bin</option>
						<option value="waste">bring it to the dump</option>
					</select>
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION FIVE </I> </B> </font> <BR>

				Which of the following is a colour ?<br>
				<input type="checkbox" name="option1" value="red"> red<br>
				[B]<script>if (option1=true) {var fivone="red"} [/B]</script>
				<input type="checkbox" name="option2" value="sky"> sky<br>
				[B]<script>if (option2=true) {var fivtwo="sky"}[/B] </script>
				<input type="checkbox" name="option3" value="dog"> dog<br>
				[B]<script>if (option3=true) {var fivtre="dog"}[/B] </script>
				</p> <BR>

				<p>
				<font color=red font size=-2> <B> <I> QUESTION SIX </I> </B> </font> <BR>

				Which one do you sit on ?<br>
				<input type="checkbox" name="option4" value="stool"> stool <br>
				<script>if (option4=true) {var sixone="stool"} </script>
				<input type="checkbox" name="option5" value="fridge"> fridge<br>
                        	<script>if (option5=true) {var sixtwo="fridge"} </script>
				<input type="checkbox" name="option6" value="kettle"> kettle<br>
				<script>if (option6=true) {var sixtre="kettle"} </script>
				</p> <BR>				

				<HR>

				<p> 
				<input type="button" value="Submit Button " name="answerbutton" onClick="javascript:checkanswers()"> 
				<input type="reset" value="Restart the Quiz" name="restartbutton">
				</p> 
			</TD>

			</TR>
		</table>
		</form>
	</center>
	</body>
</html>


  • Options
    #6
    louie
    Closed Accounts Posts: 1,200 ✭✭✭louie


    I changed the reset button to submit form cause you need to clear the previous result:

    try this:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>
<head><title>assignment 2</title>
 
<script language="javascript">
  var result=0;
  var treone;
     var furone;
  //var fivone;
  //var fivtwo;
  //var fivtre;
  //var sixone;
  //var sixtwo;
  //var sixtre;

 function checkanswers()
 {
  var ansone = document.quizform.questionone.value;
  var anstwo = document.quizform.questiontwo.value;
    
  if (ansone.toUpperCase() == "PARIS")
  { 
  result++;
  }
  if (anstwo.toUpperCase() == "ROME")
  {
  result++;
  }
  if (document.quizform.questionthree.selectedIndex=="1")
  {
  result++;
  treone="Good to recycle";
  }
  else 
  {
  furone="Wrong";
  } 
  if (document.quizform.questionfour.selectedIndex=="1")
  {
  result++;
  furone="Recycle Bin";
  }
  else 
  {
  furone="Wrong";
  } 
//option five
  var fivone = false;
     if (document.quizform.option1.checked==true) 
  {
  fivone = "red"; 
  result++;
  }
  if (document.quizform.option2.checked==true) 
  {
  fivone = "sky";
  }
  if (document.quizform.option3.checked==true) 
  {
  fivone = "dog";
  }
         
  var sixone;       
  if (document.quizform.option4.checked==true )
  {
  sixone = "stool";
  result++;
  }
  if (document.quizform.option5.checked==true )
  {
  sixone = "fridge";
  }
  if (document.quizform.option6.checked==true )
  {
  sixone = "kettle";  }
 
  {
  alert("Your answer to Question One was "+ ansone +",\n Your answer to Question Two was "+ anstwo +",\n Your answer to Question Three was "+ treone +",\n Your answer to Question Four was "+ furone +",\n Your answer to Question Five was "+ fivone +",\n Your answer to Question Six was "+ sixone +".");
  alert("You got "+ result +" out of 6");
  }
 }
</script>
 </head>
 <body>
 <center> <BR> <BR> <BR> <BR>
  <form name="quizform">
  <table border=2 cellpadding=10>
  <caption align=top> <font color=blue font size=+1><I>page1!</I></font> </caption>
  
   <TR Align=center>
   <TD> 
   <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION ONE </I> </B> </font> <BR>
    What is the capital of France ? <BR>
    <input type="text" name="questionone"> 
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION TWO </I> </B> </font> <BR>
     What is the capital of Italy? <BR>
    <input type="text" name="questiontwo"> 
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION THREE </I> </B> </font> <BR>
    Is it better to buy recycled products instead of non-recycled products ? <BR>
     <select name="questionthree">
      <option value="oneblank">--select an answer--</option>
      <option value="yes">yes, its good for the environment </option>
      <option value="no">no, its bad for the enviroment </option>
     </select>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION FOUR </I> </B> </font> <BR>
    What should you do with your recyclable waste ? <BR>
     <select name="questionfour">
      <option value="twoblank">--select an answer--</option>
      <option value="recycle">bring it to a recycle bin</option>
      <option value="waste">bring it to the dump</option>
     </select>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION FIVE </I> </B> </font> <BR>
    Which of the following is a colour ?<br>
    <input type="checkbox" name="option1" value="red"> red<br>
    <input type="checkbox" name="option2" value="sky"> sky<br>
    <input type="checkbox" name="option3" value="dog"> dog<br>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION SIX </I> </B> </font> <BR>
    Which one do you sit on ?<br>
    <input type="checkbox" name="option4" value="stool"> stool <br>
    <input type="checkbox" name="option5" value="fridge"> fridge<br>
    <input type="checkbox" name="option6" value="kettle"> kettle<br>
    </p> <BR>    
    <HR>
    <p> 
    <input type="button" value="Submit Button " name="answerbutton" onClick="javascript:checkanswers()"> 
    <input type="submit" value="Restart the Quiz" name="restartbutton">
    </p> 
   </TD>
   </TR>
  </table>
  </form>
 </center>
 </body>
</html>


  • Advertisement
  • Options
    #7
    Cork Skate
    Registered Users Posts: 884 ✭✭✭Cork Skate


    louie wrote:
    I changed the reset button to submit form cause you need to clear the previous result:

    Cheers Louie, thats better alright .... its just the count (result++) still isn't right, which i dont understand really .... a || b || c should be if any of them are check then it increments, but that is not the case. Also for Question Six the variables are coming up as undefined, which is very strange aswell, given that Five is OK, well nearly anyway. Its a head scratcher !!


  • Options
    #8
    Eoin
    Registered Users Posts: 21,257 ✭✭✭✭Eoin


    Cork Skate wrote:
    Cheers Louie, thats better alright .... its just the count (result++) still isn't right, which i dont understand really .... a || b || c should be if any of them are check then it increments, but that is not the case. Also for Question Six the variables are coming up as undefined, which is very strange aswell, given that Five is OK, well nearly anyway. Its a head scratcher !!

    Hi there,

    A couple of things:

    Put the var result=0; part inside the checkanswers() function, it is not getting reset to 0 each time the form is submitted, so the number of right answers goes up each time. Unless the variables are being used outside the checkanswers function, then they should all be inside the function.

    The checkboxes should really be radio boxes, unless you want people to be able to select multiple entries. At the moment, you can select "red" AND "sky" as a colour which is obviously incorrect, but the code doesn't take this into account.

    Try setting the variables to an empty string like this: var fivone = ""; - may help the undefined variables.

    Here's a start:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>
<head><title>assignment 2</title>

<script language="javascript">
  var result=0;
  var treone= "";
     var furone;
  //var fivone;
  //var fivtwo;
  //var fivtre;
  //var sixone;
  //var sixtwo;
  //var sixtre;

function checkanswers()
{
	var result=0;
	var ansone = document.quizform.questionone.value;
	var anstwo = document.quizform.questiontwo.value;

	if (ansone.toUpperCase() == "PARIS")
	{
	  result++;
	}

	if (anstwo.toUpperCase() == "ROME")
	{
	  result++;
	}

	if (document.quizform.questionthree.selectedIndex=="1")
	{
		result++;
		treone="Good to recycle";
	}
	else
	{
		treone="Wrong";
	}

	if (document.quizform.questionfour.selectedIndex=="1")
	{
		result++;
		furone="Recycle Bin";
	}
	else
	{
		furone="Wrong";
	}

	//option five
	var fivone = "";
	if (document.quizform.option1.checked==true)
	{
		fivone = "red";
		result++;
	}
	else if (document.quizform.option2.checked==true)
	{
		fivone = "sky";
	}
	else if (document.quizform.option3.checked==true)
	{
		fivone = "dog";
	}

	var sixone = "";
	if (document.quizform.option4.checked==true )
	{
		sixone = "stool";
		result++;
	}
	else if (document.quizform.option5.checked==true )
	{
		sixone = "fridge";
		result--;
	}
	else if (document.quizform.option6.checked==true )
	{
		sixone = "kettle";
		result--;
	}


	alert("Your answer to Question One was "+ ansone +",\n Your answer to Question Two was "+ anstwo +",\n Your answer to Question Three was "+ treone +",\n Your answer to Question Four was "+ furone +",\n Your answer to Question Five was "+ fivone +",\n Your answer to Question Six was "+ sixone +".");
	alert("You got "+ result +" out of 6");

}
</script>
 </head>
 <body>
 <center> <BR> <BR> <BR> <BR>
  <form name="quizform">
  <table border=2 cellpadding=10>
  <caption align=top> <font color=blue font size=+1><I>page1!</I></font> </caption>

   <TR Align=center>
   <TD>
   <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION ONE </I> </B> </font> <BR>
    What is the capital of France ? <BR>
    <input type="text" name="questionone">
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION TWO </I> </B> </font> <BR>
     What is the capital of Italy? <BR>
    <input type="text" name="questiontwo">
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION THREE </I> </B> </font> <BR>
    Is it better to buy recycled products instead of non-recycled products ? <BR>
     <select name="questionthree">
      <option value="oneblank">--select an answer--</option>
      <option value="yes">yes, its good for the environment </option>
      <option value="no">no, its bad for the enviroment </option>
     </select>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION FOUR </I> </B> </font> <BR>
    What should you do with your recyclable waste ? <BR>
     <select name="questionfour">
      <option value="twoblank">--select an answer--</option>
      <option value="recycle">bring it to a recycle bin</option>
      <option value="waste">bring it to the dump</option>
     </select>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION FIVE </I> </B> </font> <BR>
    Which of the following is a colour ?<br>
    <input type="checkbox" name="option1" value="red"> red<br>
    <input type="checkbox" name="option2" value="sky"> sky<br>
    <input type="checkbox" name="option3" value="dog"> dog<br>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION SIX </I> </B> </font> <BR>
    Which one do you sit on ?<br>
    <input type="checkbox" name="option4" value="stool"> stool <br>
    <input type="checkbox" name="option5" value="fridge"> fridge<br>
    <input type="checkbox" name="option6" value="kettle"> kettle<br>
    </p> <BR>
    <HR>
    <p>
    <input type="button" value="Submit Button " name="answerbutton" onClick="javascript:checkanswers()">
    <input type="submit" value="Restart the Quiz" name="restartbutton">
    </p>
   </TD>
   </TR>
  </table>
  </form>
 </center>
 </body>
</html>

    Here it is with the radio buttons instead:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>
<head><title>assignment 2</title>

<script type="text/javascript">

function checkanswers()
{
	var result = 0;
	var ansone = document.quizform.questionone.value;
	var anstwo = document.quizform.questiontwo.value;

	if (ansone.toUpperCase() == "PARIS")
	{
	  result++;
	}

	if (anstwo.toUpperCase() == "ROME")
	{
	  result++;
	}

	if (document.quizform.questionthree.selectedIndex == "1")
	{
		result++;
		treone="Good to recycle";
	}
	else
	{
		treone="Wrong";
	}

	if (document.quizform.questionfour.selectedIndex=="1")
	{
		result++;
		furone="Recycle Bin";
	}
	else
	{
		furone="Wrong";
	}

	//option five

	var fivone = "";

	for (i = 0; i < document.quizform.radCol.length; i++)
	{
		if (document.quizform.radCol[i].checked)
		{
			fivone = document.quizform.radCol[i].value;
		}
	}

	if (fivone == "red")
	{
		result++;
	}

	//option six
	var sixone = "";

	for (i = 0; i < document.quizform.radSeat.length; i++)
	{
		if (document.quizform.radSeat[i].checked)
		{
			sixone = document.quizform.radSeat[i].value;
		}
	}

	if (sixone == "stool")
	{
		result++;
	}


	alert("Your answer to Question One was "+ ansone +",\n Your answer to Question Two was "+ anstwo +",\n Your answer to Question Three was "+ treone +",\n Your answer to Question Four was "+ furone +",\n Your answer to Question Five was "+ fivone +",\n Your answer to Question Six was "+ sixone +".");
	alert("You got "+ result +" out of 6");

}
</script>
 </head>
 <body>
 <center> <BR> <BR> <BR> <BR>
  <form name="quizform">
  <table border=2 cellpadding=10>
  <caption align=top> <font color=blue font size=+1><I>page1!</I></font> </caption>

   <TR Align=center>
   <TD>
   <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION ONE </I> </B> </font> <BR>
    What is the capital of France ? <BR>
    <input type="text" name="questionone">
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION TWO </I> </B> </font> <BR>
     What is the capital of Italy? <BR>
    <input type="text" name="questiontwo">
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION THREE </I> </B> </font> <BR>
    Is it better to buy recycled products instead of non-recycled products ? <BR>
     <select name="questionthree">
      <option value="oneblank">--select an answer--</option>
      <option value="yes">yes, its good for the environment </option>
      <option value="no">no, its bad for the enviroment </option>
     </select>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION FOUR </I> </B> </font> <BR>
    What should you do with your recyclable waste ? <BR>
     <select name="questionfour">
      <option value="twoblank">--select an answer--</option>
      <option value="recycle">bring it to a recycle bin</option>
      <option value="waste">bring it to the dump</option>
     </select>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION FIVE </I> </B> </font> <BR>
    Which of the following is a colour ?<br>
    <input type="radio" name="radCol" id="radCol" value="red"> red<br>
    <input type="radio" name="radCol" value="sky"> sky<br>
    <input type="radio" name="radCol" value="dog"> dog<br>
    </p> <BR>
    <p>
    <font color=red font size=-2> <B> <I> QUESTION SIX </I> </B> </font> <BR>
    Which one do you sit on ?<br>
    <input type="radio" name="radSeat" value="stool"> stool<br>
    <input type="radio" name="radSeat" value="fridge"> fridge<br>
    <input type="radio" name="radSeat" value="kettle"> kettle<br>
    </p> <BR>
    <HR>
    <p>
    <input type="button" value="Submit Button " name="answerbutton" onClick="javascript:checkanswers()">
    <input type="submit" value="Restart the Quiz" name="restartbutton">
    </p>
   </TD>
   </TR>
  </table>
  </form>
 </center>
 </body>
</html>


  • Options
    #9
    akari no ryu
    Closed Accounts Posts: 169 ✭✭akari no ryu


    Have you thought about using AJAX to automate the generation of the test
    It would allow you to create an xml file representing the questions and answers and from there, javascript can create your form and proccess it automatically.


Advertisement