Advertisement
Help Keep Boards Alive. Support us by going ad free today. See here: https://subscriptions.boards.ie/.
If we do not hit our goal we will be forced to close the site.

Current status: https://keepboardsalive.com/

Annual subs are best for most impact. If you are still undecided on going Ad Free - you can also donate using the Paypal Donate option. All contribution helps. Thank you.
https://www.boards.ie/group/1878-subscribers-forum

Private Group for paid up members of Boards.ie. Join the club.

Javascript not doing anything in this quiz window on Submit

  • 07-10-2012 07:09PM
    #1
    Endlessly Manipulable
    Registered Users, Registered Users 2 Posts: 16 ✭


    Hi there, looking for javascript code warriors,

    This is a very basic question, just learning the fundamentals atm. Attached arre screenshots in case the code is unreadable in the thread.

    This script is supposed to open a quiz (one question) with answers written in checkboxes.

    The checkAnswers() function runs if I replace the code inside it, which means that the submit button on the form (id = "myQuiz") in quiz2.html works.

    Its the if statement that is broken and I just can't figure out why!

    Here is the pain-point in quiz2.html:
    function checkAnswers()
    {
    // determine whether the answer is correct
    if ( document.getElementById( "myQuiz" ).elements[1].checked )
    window.opener.document.getElementById( "quizSpot" ).
    innerHTML = "Congratulations, your answer is correct";
    else // if the answer is incorrect

    window.opener.document.getElementById( "quizSpot" ).
    innerHTML = "Your answer is incorrect. " +
    "Please try again <br /> <a href = " +
    \"javascript:openQuiz()\">Please take our quiz</a>";

    window.opener.focus();
    window.close();
    } // end function checkAnswers


    And here is the rest of the script (final.html):
    <?xml version = "1.0" encoding = "utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;

    <!-- Fig. 11.16: final.html -->
    <!-- Rich welcome page using several JavaScript concepts. -->
    <html xmlns = "http://www.w3.org/1999/xhtml"&gt;
    <head>
    <title>Putting it All Together</title>
    <script type = "text/javascript">
    <!--
    var now = new Date(); // current date and time
    var hour = now.getHours(); // current hour

    var quotes = [ "Form ever follows function.<br />" +
    " Louise Henri Sullivan", "E pluribus unum." +
    " (One composed of many.) <br /> Virgil", "Is it a" +
    " world to hide virtues in?<br /> William Shakespeare" ];

    function openQuiz()
    {
    window.open( "quiz2.html", "", "toolbar = no, " +
    "menubar = no, scrollBars = no" );
    } // end function openQuiz

    function allQuotes()
    {
    // create the child window for the quotes
    var quoteWindow = window.open( "", "", "resizable=yes, " +
    "toolbar=no, menubar=no, status=no, location=no," +
    " scrollBars=yes" );
    quoteWindow.document.write( "<p>" )

    // loop through all quotes and write them in the new window
    for ( var i = 0; i < quotes.length; i++ )
    quoteWindow.document.write( ( i + 1 ) + ".) " +
    quotes[ i ] + "<br /><br />");

    // write a close link to the new window
    quoteWindow.document.write( "</p><br /><a href = " +
    "\"javascript:window.close()\">Close this window</a>" );
    } // end function allQuotes
    // -->
    </script>
    </head>

    <body>
    <p><a href = "javascript:allQuotes()">View all quotes</a></p>

    <p id = "quizSpot">
    <a href = "javascript:openQuiz()">Please take our quiz</a></p>

    <script type = "text/javascript">
    // variable that gets the last modification date and time
    var modDate = new Date( document.lastModified );

    // write the last modified date and time to the page
    document.write ( "This page was last modified " +
    modDate.toLocaleString() );
    </script>
    </body>
    </html>

    quiz2.html:
    <?xml version = "1.0" encoding = "utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;

    <!-- Fig. 11.17: quiz2.html -->
    <!-- Online quiz in child window. -->
    <html xmlns = "http://www.w3.org/1999/xhtml"&gt;
    <head>
    <title>Online Quiz</title>
    <script type = "text/javascript">
    <!--
    function checkAnswers()
    {
    // determine whether the answer is correct
    if ( document.getElementById( "myQuiz" ).elements[1].checked )
    window.opener.document.getElementById( "quizSpot" ).
    innerHTML = "Congratulations, your answer is correct";
    else // if the answer is incorrect
    document.write( "</p><br /><a href = " +
    "\"javascript:window.close()\">Close this window</a>" );

    window.opener.document.getElementById( "quizSpot" ).
    innerHTML = "Your answer is incorrect. " +
    "Please try again <br /> <a href = " +
    \"javascript:openQuiz()\">Please take our quiz</a>";

    window.opener.focus();
    window.close();
    } // end function checkAnswers
    // -->
    </script>
    </head>

    <body>
    <form id = "myQuiz" action = "javascript:checkAnswers()">
    <p>Select the name of the tip that goes with the
    image shown:<br />
    <img src = "EPT.gif" alt = "mystery tip" />
    <br />

    <input type = "radio" name = "radiobutton" value = "CPE" />
    <label>Common Programming Error</label>

    <input type = "radio" name = "radiobutton" value "EPT" />
    <label>Error-Prevention Tip</label>

    <input type = "radio" name = "radiobutton" value "PERF" />
    <label>Performance Tip</label>

    <input type = "radio" name = "radiobutton" value "PORT" />
    <label>Portability Tip</label>

    <input type = "submit" name = "Submit" value = "Submit" />
    <input type = "reset" name = "reset" value = "Reset" />
    </p>
    </form>
    </body>
    </html>


Comments

  • #2
    juan.kerr
    Closed Accounts Posts: 2,766 ✭✭✭juan.kerr


    if ( document.getElementById( "myQuiz" ).elements[1].checked ) {

    } else {

    }


  • #3
    Endlessly Manipulable
    Registered Users, Registered Users 2 Posts: 16 ✭Endlessly Manipulable


    Thanks, but tried that, no joy :-(

    Firebug is not finding any syntax errors or anything


  • #4
    DonkeyStyle \o/
    Closed Accounts Posts: 7,144 ✭✭✭DonkeyStyle \o/


    This needs fixing too...
    [PHP]window.opener.document.getElementById( "quizSpot" ).
    innerHTML = "Your answer is incorrect. " +
    "Please try again <br /> <a href = " +
    \"javascriptpenQuiz()\">Please take our quiz</a>";
    [/PHP]
    You're jumping out of the string after '<a href = ', then going right into an escaped double quote.
    Try...
    [PHP]window.opener.document.getElementById( "quizSpot" ).innerHTML = "Your answer is incorrect. " +
    "Please try again <br /> <a href = \"javascript:openQuiz()\">Please take our quiz</a>";[/PHP]
    Or use single quotes on the outside, so you don't have to escape the doubles.
    [PHP]window.opener.document.getElementById( "quizSpot" ).innerHTML = 'Your answer is incorrect. ' +
    'Please try again <br /> <a href = "javascript:openQuiz()">Please take our quiz</a>';[/PHP]


  • #5
    Endlessly Manipulable
    Registered Users, Registered Users 2 Posts: 16 ✭Endlessly Manipulable


    Oh my ****ing God, a ****ing double ****ing quote \O/ What a pain in the hole :-/

    Thanks a million though :-)


  • #6
    DonkeyStyle \o/
    Closed Accounts Posts: 7,144 ✭✭✭DonkeyStyle \o/


    Yeah I know the feeling, I've also played Guess Which Typo Is Breaking The Function. :o ... the quiz I think everyone has written in javascript at some stage.


  • Advertisement
Advertisement