CSS Codes
CSS Layouts
Results 1 to 3 of 3

Thread: Using textboxes...

  1. 11-24-2007, 10:38 AM #1
    musicgal3
    musicgal3 is offline New Comer (less than 5 posts)
    Join Date
    Nov 2007
    Location
    Australia
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Using textboxes...

    I am currently creating a quiz using radio boxes & textboxes. I have a score function, but I can only get it to work with the radio buttons - it doesn't seem to work on the textboxes. I was wondering if anyone can help? Here's my current code for the page:

    Code:
    <html>

<head>
<title>Terminology Test Quiz</title>

<script LANGUAGE="JavaScript">

<!--

var score = 0;

var string_1 = "con";

var string_2 = "1";

function ShowScore()
{
if (document.Quiz.Allegro[0].checked == true)
{
score = score + 1
}

if (document.Quiz.Pulses[2].checked == true)
{
score = score + 1
}

if (document.Quiz.With[string_1] == true)
{
score = score + 1
}

if (document.Quiz.Time_Terms[1].checked == true)
{
score = score + 1
}

if (document.Quiz.Minim[string_2] == true)
{
score = score + 1
}

alert("You got " + score + " out of 10 questions correct.");
forceReloadFromServer = true;
window.location.reload(forceReloadFromServer);
}

//-->

/this is for the quiz/

</script>

<style>
<!--
a:link {color: "#FFEDAF"}
a:visited  {color: "#FFFFFF"}
a:active {text-decoration: none}
a:hover {color: "#EEEEEE"}
//-->
/this is to change to link colours/
</style>

<style>
<!--
BODY{
scrollbar-face-color:#000000;
scrollbar-arrow-color:#FFEDAF;
scrollbar-track-color:#FFEDAF;
scrollbar-shadow-color:'';
scrollbar-highlight-color:'';
scrollbar-3dlight-color:'';
scrollbar-darkshadow-Color:'';
}
-->
/this is to change the scrollbar colour/
</style>

</head>

<body bgcolor="#FFEDAF">

<center><table width="100%">
<tr>
<td colspan="2">
<table bgcolor="#000000" border="3" color="#000000">
<tr><td><a href="Index.html" alt="Home">Home</a>
<p><a href="Rhythms.html" alt="Rhythms">Basic Rhythms</a>
<p><a href="Signs & Terms.html" alt="Signs & Terms">Basic Signs & Terms</a>
<p><a href="Quiz.html" alt="Quiz">Test Quiz</a>
</td></tr></table>
</td>
<td><h1><font face="Elephant" color="#000000">Terminology <br>Test Quiz</font></h1></td>
</tr>
<center><table bgcolor="#000000" border="3" color="#000000">
<tr><td><h3><font face="Times New Roman" color="#FFEDAF">
<script LANGUAGE="JavaScript">
<!--
var YourName = prompt("What is your name?","");
document.write("Are you ready for the TEST QUIZ, " + YourName + "?")
//-->
</script>
</font></h3>
</td></tr>
<tr bgcolor="#FFEDAF"><td>
<form name="Quiz" action ="javascript:process()">
<h4>Question 1 - What is the meaning of the term <i>Allegro</i>?</h4>

<input type ="radio" name="Allegro" value = "Fast and Lively">Fast and Lively<br>
<input type ="radio" name="Allegro" value = "Extremely Fast">Extremely Fast<br>
<input type ="radio" name="Allegro" value = "Broadly">Broadly<br>
<input type ="radio" name="Allegro" value = "At an easy walking pace">At an easy walking pace<br><br>

<h4>Question 2 - How many pulses can be heard in 9/8 time?</h4>

<input type ="radio" name="Pulses" value = "1">1<br>
<input type ="radio" name="Pulses" value = "2">2<br>
<input type ="radio" name="Pulses" value = "3">3<br>
<input type ="radio" name="Pulses" value = "4">4<br><br>

<h4>Question 3 - What is the Italian for <i>'with'</i>?</h4>

<input type ="text" name="With"><br><br>

<h4>Question 4 - How many terms are used to describe Four-Four Time (apart from 'Four-Four')?</h4>

<input type ="radio" name="Time_Terms" value = "0">0<br>
<input type ="radio" name="Time_Terms" value = "2">2<br>
<input type ="radio" name="Time_Terms" value = "4">4<br>
<input type ="radio" name="Time_Terms" value = "5">5<br><br>

<h4>Question 5 - How many minim beats are there in a bar of Two-Four Time (in numerals)?</h4>

<input type ="text" name="Minim"><br><br>

<input type="button" name="score" value="Score" onclick="ShowScore()">
<input type="reset" value="Reset">
</form>
</td></tr>
</table></center>

<tr><td>

<form>
<!--
<select id="topics" onchange="top.location.href=this.options[this.selectedIndex].value;">
<option value ="Quiz.html" SELECTED>Please select a destination...</option>
<option value ="Index.html">Basic Music Terminology</option>
<option value ="Rhythms.html">Basic Rhythms</option>
<option value ="Signs & Terms.html">Basic Signs & Terms</option>
<option value ="Quiz.html">Test Yourself...</option>
</selected>
//-->
</form>

</td></tr>

</table></center>

</body>
</html>
    Last edited by djr33; 11-24-2007 at 10:41 AM. Reason: code tags added
    Reply With Quote Reply With Quote
  2. 11-24-2007, 01:54 PM #2
    jscheuer1's Avatar
    jscheuer1
    jscheuer1 is offline Global Moderator
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    I didn't fix all of the poor coding practices (particularly in the HTML portion), but I did get rid of many unnecessary comments, and turned things that weren't really comments, but meant to be, into valid comments. I used proper syntax for the style and script tags. And combined the two style sections.

    Oh, and the score function now works:

    Code:
    <html>

<head>
<title>Terminology Test Quiz</title>
<script type="text/javascript">
function ShowScore(){
var string_1 = "con";
var string_2 = "1";
var score = 0, e=document.Quiz.elements;
if (e.Allegro[0].checked)
score++
if (e.Pulses[2].checked)
score++
if (e.With.value.toLowerCase()==string_1)
score++
if (e.Time_Terms[1].checked)
score++
if (e.Minim.value==string_2)
score++
alert("You got " + score + " out of 5 questions correct, " + YourName + ".");

window.location.reload(true);
}
</script>


<style type="text/css">

a:link {color: "#ffedaf"}
a:visited  {color: "#ffffff"}
a:active {text-decoration: none}
a:hover {color: "#eeeeee"}

/*this is to change to link colours*/

body {
background-color:#ffedaf;
color:black;
scrollbar-face-color:#000000;
scrollbar-arrow-color:#ffedaf;
scrollbar-track-color:#ffedaf;
scrollbar-shadow-color:'';
scrollbar-highlight-color:'';
scrollbar-3dlight-color:'';
scrollbar-darkshadow-color:'';
}

/*this is to change the scrollbar colour*/

</style>

</head>

<body>

<center><table width="100%">
<tr>
<td colspan="2">
<table bgcolor="#000000" border="3" color="#000000">
<tr><td><a href="Index.html" alt="Home">Home</a>
<p><a href="Rhythms.html" alt="Rhythms">Basic Rhythms</a>
<p><a href="Signs & Terms.html" alt="Signs & Terms">Basic Signs & Terms</a>
<p><a href="Quiz.html" alt="Quiz">Test Quiz</a>
</td></tr></table>
</td>
<td><h1><font face="Elephant" color="#000000">Terminology <br>Test Quiz</font></h1></td>
</tr>
<center><table bgcolor="#000000" border="3" color="#000000">
<tr><td><h3><font face="Times New Roman" color="#FFEDAF">
<script type="text/javascript">

var YourName = prompt("What is your name?","");
document.write("Are you ready for the TEST QUIZ, " + YourName + "?")

</script>
</font></h3>
</td></tr>
<tr bgcolor="#FFEDAF"><td>
<form name="Quiz" action ="javascript:process()">
<h4>Question 1 - What is the meaning of the term <i>Allegro</i>?</h4>

<input type ="radio" name="Allegro" value = "Fast and Lively">Fast and Lively<br>
<input type ="radio" name="Allegro" value = "Extremely Fast">Extremely Fast<br>
<input type ="radio" name="Allegro" value = "Broadly">Broadly<br>
<input type ="radio" name="Allegro" value = "At an easy walking pace">At an easy walking pace<br><br>

<h4>Question 2 - How many pulses can be heard in 9/8 time?</h4>

<input type ="radio" name="Pulses" value = "1">1<br>
<input type ="radio" name="Pulses" value = "2">2<br>
<input type ="radio" name="Pulses" value = "3">3<br>
<input type ="radio" name="Pulses" value = "4">4<br><br>

<h4>Question 3 - What is the Italian for <i>'with'</i>?</h4>

<input type ="text" name="With"><br><br>

<h4>Question 4 - How many terms are used to describe Four-Four Time (apart from 'Four-Four')?</h4>

<input type ="radio" name="Time_Terms" value = "0">0<br>
<input type ="radio" name="Time_Terms" value = "2">2<br>
<input type ="radio" name="Time_Terms" value = "4">4<br>
<input type ="radio" name="Time_Terms" value = "5">5<br><br>

<h4>Question 5 - How many minim beats are there in a bar of Two-Four Time (in numerals)?</h4>

<input type ="text" name="Minim"><br><br>

<input type="button" name="score" value="Score" onclick="ShowScore()">
<input type="reset" value="Reset">
</form>
</td></tr>
</table></center>

<tr><td>

<form>

<select id="topics" onchange="top.location.href=this.options[this.selectedIndex].value;">
<option value ="Quiz.html" SELECTED>Please select a destination...</option>
<option value ="Index.html">Basic Music Terminology</option>
<option value ="Rhythms.html">Basic Rhythms</option>
<option value ="Signs & Terms.html">Basic Signs & Terms</option>
<option value ="Quiz.html">Test Yourself...</option>
</select>

</form>

</td></tr>

</table></center>

</body>
</html>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate
    Reply With Quote Reply With Quote
  3. 11-25-2007, 05:06 AM #3
    musicgal3
    musicgal3 is offline New Comer (less than 5 posts)
    Join Date
    Nov 2007
    Location
    Australia
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    This helps a lot. Thankyou x infinity!
    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Forum Rules