CODEWITHSUNDEEP
javascripthtml
Jennifer Fitzgerald
Jennifer Fitzgerald

Reputation: 137

How to pass an a value from a page to another using javascript

How do you pass a value or an array from one page to another in html using javascript. I'm not allowed to use local storage or sessions only pass the variable from page to page. I'm sending values from a radio button. I intend to store the results in array as i am keeping track of the users answer to display the result at the end. How do i send an array to quiz_5.html? I intend to keep passing the array instead of using a cookie or local storage as i am not permitted to.

Below is My code:

<div>
    <form>
        <input type="radio" name="radio" value="correct" class="firstRow"> NASA.Gov
        <input type="radio" name="radio" value="incorrect" class="secondRow"> Data.Gov <br>
        <input type="radio" name="radio" value="incorrect" class="firstRow"> Facebook
        <input type="radio" name="radio" value="incorrect" class="secondRow"> XYZ.net <br>

        <input type="button" value="Submit & Next Question" onclick="getAnswer4(this.form)" class="firstRow">
        <input type="button" value="Cancel & Clear Selection" onclick="clearOptions(this.form)" class="secondRow">
    </form>
</div>

Javascript code:

function getAnswer4(form) {
    var a[];
    var value;

    var checked = form.querySelector("input[type=radio]:checked");

    if(!checked) {
        alert('Please select an answer');
        return;
    }
    else{
        value = checked.value;

    }
    a.push(value);
    location.href = "quiz_5.html";
}

Upvotes: 0

Views: 165

Answers (2)

gavgrif
gavgrif

Reputation: 15489

Sorry if my comments seemed harsh, but I am all about new coders learning the basics themselves without relying on having the answers provided. Just to show it can be done - I just created three HTML pages. Created a form in the first two - each with your questions (questions 1 and 2 in the first page and question 3 in the second page), and passed the form values to the next one, using nothing more than html.

Then using only JavaScript on the second and third pages, I grabbed the values out of the URL and did stuff with them. On page two, I re-used the values from page 1 (think how that might have been done and why it is useful) so that all three values are passed to page 3 which then used JavaScript only to grab the 3 values, display them on the page (as shown in the code section below) and calculate the total and the percentage of answers that are correct. Note that I answered the questions so that I got question 2 incorrect.

Note that I am not giving the code used, but will give you the URL of the pages so that you can see the outcome of the previous two pages and can then start to think how I achieved this.

numbers1.html
numbers2.html?one=correct&two=incorrect
numbers3.html?one=correct&two=incorrect&three=correct

Question 1: correct

Question 2:incorrect

Question 3:correct

2/3

0.67% correct

Not a traditional answer I know, but it is not ideal for learners simply ask for the answer to be provided, especially when in 10 minutes I was able to put together the three pages that achieved the outcome. If you do not try then you will not learn for yourself.

Upvotes: 1

StackSlave
StackSlave

Reputation: 10627

You should just have one HTML button for the entire form. First, let's fix that form tag:

<form name='form' id='form' method='get' action='quiz_5.php'>

Now let's add a submit button to the bottom of the form:

<input type='submit' name='sub' id='sub' value='Submit' />

On quiz_5.html

var pre = onload;
onload = function(){
if(pre)pre();

var resultObject = {};
var fs = location.search.replace('?', '').split('&');
for(var i=0,l=fs.length; i<l; i++){
   var z = fs[i].split('=');
   resultObject[decodeURIComponent(z[0])] = decodeURIComponent(z[1]);
}
/* resultObject now has values based on name attibute
   for instance resultObject.radio will hold value of name='radio' where it's checked */
}

Upvotes: 1

Related Questions