Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7

Thread: javascript quiz

  1. #1
    New Coder
    Join Date
    Dec 2004
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    javascript quiz

    Hi there!

    Im trying to create a simple javascript quiz for my website but im a bit stuck on some of it. ive been advised that both the questions and answers should be stored in arrays....theres six questions and theres a multiple choice answer for each question which is viewed and selected by a pull down menu.

    at the bottom of the quiz is a button "Score quiz" which shows how well the user has done out of the 6 questions. then id like a button that says "store result" which makes the score visible on the next page, which is the home page.

    so far i have the questions with the answers appearing on the pulldown menus (not in arrays tho i cant seem to get it working like that can someone show me here?).

    thanks a lot im really stuck here, please help, appreciate it!

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Nashua, NH
    Posts
    1,724
    Thanks
    0
    Thanked 0 Times in 0 Posts
    What you want to have is a data object that uses arrays where appropriate:
    Code:
    var quizData={
       randomOrder: true,
       otherQuizOption: value,
       questions:[
         { text: "Is grass green?",
           answers:[
             { text: "Yes",
               score: 1},
             { text: "No",
               score: -1},
             { text: "Not sure",
               score: 0}]},
         { text: "What color is grass?",
           answers:[
             { text: "Red",
               score: -1},
             { text: "Green",
               score: 1},
             { text: "Yellow",
               score: 0}]},  
         /* Rinse Repeat */
    ]};
    When you get tired of reinventing a wheel, check this out: www.klproductions.com/klquiz.html
    Vladdy | KL
    "Working web site is not the one that looks the same on common graphical browsers running on desktop computers, but the one that adequately delivers information regardless of device accessing it"

  • #3
    New Coder
    Join Date
    Dec 2004
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok cool and how do i get that to appear in drop down menu form and how does it keep track of how many right answers there are to display a score at the bottom?

  • #4
    Regular Coder
    Join Date
    Jan 2004
    Location
    San Antonio, TX
    Posts
    131
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Would this be what you are asking for???

    It is not in a dropdown format, but It's another option you may want to try out.

    Code...

    <BODY>
    <FORM NAME="quizForm">
    <TABLE>
    <TR><TD>Black = White</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q0" VALUE="false">
    or False <INPUT TYPE="RADIO" NAME="q0" VALUE="true"> ?</TD></TR>
    <TR><TD>2 + 2 = 4</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q1" VALUE="true">
    or False <INPUT TYPE="RADIO" NAME="q1" VALUE="false"> ?</TD></TR>
    <TR><TD>5 - 3 = 1</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q2" VALUE="false">
    or False <INPUT TYPE="RADIO" NAME="q2" VALUE="true"> ?</TD></TR>
    <TR><TD>7 * 7 = 49</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q3" VALUE="true">
    or False <INPUT TYPE="RADIO" NAME="q3" VALUE="false"> ?</TD></TR>
    <TR><TD>36 / 6 = 5</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q4" VALUE="false">
    or False <INPUT TYPE="RADIO" NAME="q4" VALUE="true"> ?</TD></TR>
    <TR><TD>99 - 33 = 66</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q5" VALUE="true">
    or False <INPUT TYPE="RADIO" NAME="q5" VALUE="false"> ?</TD></TR>
    <TR><TD>33 + 99 = 66</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q6" VALUE="false">
    or False <INPUT TYPE="RADIO" NAME="q6" VALUE="true"> ?</TD></TR>
    <TR><TD>5 + 4 + 3 = 12</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q7" VALUE="true">
    or False <INPUT TYPE="RADIO" NAME="q7" VALUE="false"> ?</TD></TR>
    <TR><TD>6 + 5 + 4 = 13</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q8" VALUE="false">
    or False <INPUT TYPE="RADIO" NAME="q8" VALUE="true"> ?</TD></TR>
    <TR><TD>81 / 9 = 9</TD>
    <TD>True <INPUT TYPE="RADIO" NAME="q9" VALUE="true">
    or False <INPUT TYPE="RADIO" NAME="q9" VALUE="false"> ?</TD></TR>
    </TABLE>

    <P>
    <INPUT TYPE="BUTTON" onClick="validateAnswers()" VALUE="Check Answers">
    Correct: <INPUT TYPE="TEXTBOX" NAME="correct" VALUE="" SIZE="3">
    Wrong: <INPUT TYPE="TEXTBOX" NAME="wrong" VALUE="" SIZE="3">
    Blank: <INPUT TYPE="TEXTBOX" NAME="blank" VALUE="" SIZE="3">
    </FORM>

    <SCRIPT LANGUAGE="JavaScript"><!--
    function validateAnswers() {
    var correct = 0;
    var wrong = 0;
    var blank = 0;
    for (var i=0;i<10;i++) {
    var yesChoice = eval("document.quizForm.q" + i + "[0].checked");
    var noChoice = eval("document.quizForm.q" + i + "[1].checked");
    var yesAnswer = eval("document.quizForm.q" + i + "[0].value");
    var noAnswer = eval("document.quizForm.q" + i + "[1].value");

    if (yesChoice == noChoice)
    blank++; // can't both be checked, thus must be both unchecked
    else {
    if ((yesChoice.toString() == yesAnswer) &&
    (noChoice.toString() == noAnswer))
    correct++;
    else
    wrong++;
    }
    }
    document.quizForm.correct.value = correct;
    document.quizForm.wrong.value = wrong;
    document.quizForm.blank.value = blank;
    }
    //--></SCRIPT>

    </BODY>


    Hope this helps.

    ImperialSpider

  • #5
    New Coder
    Join Date
    Dec 2004
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thanks imperial spider that was helpful! ive modified your code to put in drop down format, but i need to remove where you record how many wrong answers there are and how many were left blank (I only need to record how many right answers were given) but everytime i try to do it the quiz stops working

    Can someone show me how to modify imperial spiders code so that only the number of correct answers are recorded?

    thanks so much!

  • #6
    New Coder
    Join Date
    Dec 2004
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    anyone?

  • #7
    Regular Coder
    Join Date
    Jan 2004
    Location
    San Antonio, TX
    Posts
    131
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Smile just remove the boxes you don't want

    look in the code, where you see this...



    Code:


    <P>
    <INPUT TYPE="BUTTON" onClick="validateAnswers()" VALUE="Check Answers">
    Correct: <INPUT TYPE="TEXTBOX" NAME="correct" VALUE="" SIZE="3">
    Wrong: <INPUT TYPE="TEXTBOX" NAME="wrong" VALUE="" SIZE="3">
    Blank: <INPUT TYPE="TEXTBOX" NAME="blank" VALUE="" SIZE="3">
    </FORM>

    and change it to this...

    Code:

    <P>
    <INPUT TYPE="BUTTON" onClick="validateAnswers()" VALUE="Check Answers">
    Correct: <INPUT TYPE="TEXTBOX" NAME="correct" VALUE="" SIZE="3">
    </FORM>

    and that should do it.

    Good Luck,

    Imperial Spider


  •  

    Posting Permissions

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