Not performing my last line of code

Question

I have a jQuery quiz which works fine except for one small thing at the end. I want the app to go to the final page (ThankYouPage.html) and give some summary statistics. It goes to the page but it only shows the portion that says, "Thank you for taking this short quiz..." The summary stats do not appear. Can you tell me what is making this happen? My code is below. Thank you.

JS

function finalGrade() {
    //pulls the current counter from local storage
    var counter = localStorage.getItem('counter');
    var myPercent = (counter / 3) * 100;
    var myFinalPercent = myPercent.toFixed(2);
    if (myPercent < 80) {
        var failOrPass = "Failing";
            var QuestionNumber = "Quiz on Croatia.";
            var QuizDesc = "Quiz questions on the country of Croatia.";
            var name = localStorage.getItem('name');
            var email = localStorage.getItem('email');
            QuizFailed(email, name, QuestionNumber, QuizDesc);
        } else {
            var failOrPass = "Passing";
            //QuizPassed();
            }
    document.location.replace("ThankYouPage.html");
    $('#summaryID').append("You scored " + counter + " out of a possible 3 for " + myFinalPercent + "%. This results in a " + failOrPass + " score.");
}

HTML5

<body>

<div class="container">
  <h1>Thank you for taking this short quiz on the country of Croatia.</h1>
  <p id="summaryID"></p>
</div>


<script src="js/init.js" type="text/javascript"></script>
<script src="js/xapiwrapper.min.js" type="text/javascript"></script>
</body>

score 1 · Answer 1 · answered Jul 18 '16 at 17:54

The document.location.replace() call is essentially going to navigate away from your current page. The problem with this is that any code still to be executed (i.e. your output code) is going to be executed on the page that is being navigated away from, and thus not executed :

// Navigates to Thank You page
document.location.replace("ThankYouPage.html");
// At this point you are already navigating, so this is ignored
$('#summaryID').append('...');

If you expect your values to appear within the next page, you might consider passing them along somehow, either through server-side code, a query string parameter or via local storage to be accessed on the following page.

score 0 · Answer 2 · answered Jul 18 '16 at 17:53

0

document.location.replace("ThankYouPage.html") basically navigates away, which is why the next line is never reached... the browser has moved on to the page you told it to load

answered Jul 18 '16 at 17:53

Neil N

24,862
16
85
145

Not performing my last line of code

2 Answers2